来自：https://www.cnblogs.com/leaf930814/p/6667011.html
一、前言
forEach()和map()两个方法都是ECMA5中Array引进的新方法，主要作用是对数组的每个元素执行一次提供的函数，但是它们之间还是有区别的。jQuery也有一个方法$.each(),长得和forEach()有点像，功能也类似。但是从本质上还是有很大的区别的，那么我们探探究竟。
二、forEach和map语法
2.1、语法：
array.forEach(callback(currentValue, index, array){
//do something
}, this)
//或者
array.forEach(callback(currentValue, index, array){
//do something
})
//map:
var new_array = arr.map(callback[, thisArg])
//$.each()
$(selector).each(function(index,element)) //注意参数的顺序
callback: 为数组中每个元素执行的函数,该函数接收三个参数，
参数一：当前数组中元素；参数二：索引； 参数三：当前数组。
this：可选，执行会掉时候，this的指向。
2.2、区别
2.2.1、forEach()返回值是undefined，不可以链式调用。
2.2.2、map()返回一个新数组，原数组不会改变。
2.2.3、没有办法终止或者跳出forEach()循环，除非抛出异常，所以想执行一个数组是否满足什么条件，返回布尔值，可以用一般的for循环实现，或者用Array.every()或者Array.some();
2.2.4、$.each()方法规定为每个匹配元素规定运行的函数，可以返回 false 可用于及早停止循环。
三、一些栗子
3.1 在使用forEach()时候，如果数组在迭代的视乎被修改，则其他元素会被跳过。因为forEach()不会在迭代之前创建数组的副本。
3.2反转字符串
var str = '12345';
Array.prototype.map.call(str, function(x) { //同时利用了call()方法
return x;
}).reverse().join('');
3.3一个笔试题。
1["1", "2", "3"].map(parseInt); //结果 [1, NaN, NaN]
如果想得到[1, 2,3]应该这么做
function returnInt(element){
return parseInt(element,10);
}
["1", "2", "3"].map(returnInt);
这主要是因为 parseInt()默认有两个参数，第二个参数是进制数。当parsrInt没有传入参数的时候，而map()中的回调函数时候，会给它传三个参数，第二个参数就是索引，明显不正确，所以返回NaN了。
四、兼容性
forEach()和map()是ECMA5新引入的，可能在标准的其他实现中不存在，在使用前可以要Ployfill一下。
具体网上很多吧，更多的是在ie9以下，如果你的项目无视这些，那么你可以不care。
首先map方法：
map对一个数组对象进行操作时，一般是生成一个新的数组，可以在map中限制生成新数组的条件，有返回值
forEach方法：
forEach方法一般是对原有的数组进行操作，没有返回值
示例
下方提供了一个数组，如果我们想将其中的每一个元素翻倍，我们可以使用map和forEach来达到目的。
let arr = [1, 2, 3, 4, 5];
ForEach
注意，forEach是不会返回有意义的值的。
我们在回调函数中直接修改arr的值。
arr.forEach((num, index) => {
return arr[index] = num * 2;
});
执行结果如下：
// arr = [2, 4, 6, 8, 10]
Map
let doubled = arr.map(num => {
return num * 2;
});
执行结果如下：
// doubled = [2, 4, 6, 8, 10]
执行速度对比
jsPref是一个非常好的网站用来比较不同的JavaScript函数的执行速度。
这里是forEach()和map()的测试结果：
可以看到，在我到电脑上forEach()的执行速度比map()慢了70%。每个人的浏览器的执行结果会不一样。
哪个更好呢？
取决于你想要做什么。
forEach适合于你并不打算改变数据的时候，而只是想用数据做一些事情 – 比如存入数据库或则打印出来。
let arr = ['a', 'b', 'c', 'd'];
arr.forEach((letter) => {
console.log(letter);
});
// a
// b
// c
// d
map()适用于你要改变数据值的时候。不仅仅在于它更快，而且返回一个新的数组。这样的优点在于你可以使用复合(composition)(map(), filter(), reduce()等组合使用)来玩出更多的花样。
rr = [1, 2, 3, 4, 5];
let arr2 = arr.map(num => num * 2).filter(num => num > 5);
// arr2 = [6, 8, 10]
我们首先使用map将每一个元素乘以2，然后紧接着筛选出那些大于5的元素。最终结果赋值给arr2。
核心要点
能用forEach()做到的，map()同样可以。反过来也是如此。
map()会分配内存空间存储新数组并返回，forEach()不会返回数据。
forEach()允许callback更改原始数组的元素。map()返回新的数组。
---------------------
作者：快乐的小z
来源：CSDN
原文：https://blog.csdn.net/alison_z/article/details/80811317
版权声明：本文为博主原创文章，转载请附上博文链接！
网友评论