JavaScript中的Map和ForEach有什么区别？
如果你使用JavaScript一段时间了，你可能遇到两个相似的数组方法：Array.prototype.map()和Array.prototype.forEach()。
那么，它们有什么不同？
Map & ForEach 定义
我们先看一眼它们在MDN上的定义：
- forEach() -- 对数组中的每个元素执行提供的函数
- map() -- 在被调用的数组基础上创建一个新数组，并对数组中的每个元素执行方法
这到底意味着什么？
嗯，forEach方法实际上没有返回什么东西（undefined）。它只是简单为数组中的每个元素提供一个方法。允许该回调方法改变调用的数组。
译者加
let arr = [1, 2, 3] arr.forEach((item, index)=> { arr[index] = item * 3 }) console.log(arr) // [3, 6, 9] 复制代码
相似的，map()也为数组中的每个元素都提供了方法调用。区别在于，map()使用返回值，并实际返回和（旧）数组相同大小的新数组。
译者加
console.log(
[1, 2, 3].map(item => {
console.log(item)
})
)
// 1
// 2
// 3
// [undefined, undefined, undefined]
代码示例
考虑到下面的数组。如果我们相对数组中的元素double，那么我们可以使用map或forEach。
let arr = [1, 2, 3, 4, 5]; 复制代码
ForEach:
注意：你永远不会从forEach函数的返回return值，因为返回值被抛弃。
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] 复制代码
速度注意事项
测试JavaScript方法和函数执行速度区别，jsPerf是一个很好的网站。
正如你看到的，在我的机器上，forEach()比map()执行速度慢了超过70%。在你的浏览器上可能不同，你可以在此处查看完整的测试结果：
功能注意事项
如果你喜欢函数编程，明白如何使用map()很重要。
因为forEach()可以影响并更改我们原有的数组，然而，map()返回一个完整的新数组--它不会更改原数组。
哪个更好？
这取决于你尝试实现什么功能。
当你尝试不更改你数组元素的时候，forEach()更合适些。比如只是想简单干点什么：比如将元素存储到数据库或者打印出来。
let arr = ['a', 'b', 'c', 'd']; arr.forEach((letter) => { console.log(letter); }); // a // b // c // d 复制代码
至于map()，当你想变更数据的时候，它更合适些。不仅仅因为它执行速度更快，而且它返回一个新数组。这就意味着我们可以做一些很棒的事，比如和其他方法（map()，filter()，reduce()等）链式调用。
let arr = [1, 2, 3, 4, 5]; let arr2 = arr.map(num => num * 2).filter(num => num > 5); // arr2 = [6, 8, 10] 复制代码
上面的示例首先是遍历arr，为数组的每个元素乘2。接着，我们过滤新数组，并且只保留大于5的元素。这就得到了我们的最终数组arr2，值为[6,8,10]。
重点
- 几乎能用
forEach()实现的功能，都可以使用map()实现，反之亦然。 map()分配内存并存储返回值。forEach()摒弃返回值，并最终返回undefined（这个方法没有返回值）。forEach()允许回调函数更改当前的数组。map()将返回一个新数组。
