JavaScript:.forEach()和.map()之间的区别

我知道有很多这样的话题.我知道基础知识:.forEach()在原始数组和.map()新数组上运行.

就我而言:

function practice (i){
    return i+1;
};

var a = [ -1, 0, 1, 2, 3, 4, 5 ];
var b = [ 0 ];
var c = [ 0 ];
console.log(a);
b = a.forEach(practice);
console.log("=====");
console.log(a);
console.log(b);
c = a.map(practice);
console.log("=====");
console.log(a);
console.log(c);

这是输出:

[ -1, 0, 1, 2, 3, 4, 5 ]
=====
[ -1, 0, 1, 2, 3, 4, 5 ]
undefined
=====
[ -1, 0, 1, 2, 3, 4, 5 ]
[ 0, 1, 2, 3, 4, 5, 6 ]

为什么用我无法理解practice的变化值b对undefined.
如果这是一个愚蠢的问题,我很抱歉,但我对这种语言很新,我找到的答案到目前为止并不能让我满意.

1> Richard Hami..：

---

他们不是同一个人.让我解释一下这个区别.

forEach:迭代列表并将一些带副作用的操作应用于每个列表成员(例如:将每个列表项保存到数据库)

map:迭代列表,转换该列表的每个成员,并返回与转换成员相同大小的另一个列表(例如:将字符串列表转换为大写)

参考

Array.prototype.forEach() - JavaScript | MDN

Array.prototype.map() - JavaScript | MDN

---

就像Xufox所说 - .forEach不返回任何东西,就是这样.感谢帮助!我会在10分钟内标出这个答案.

2> poke..：

---

Array.forEach "每个数组元素执行一次提供的函数."

Array.map "创建一个新数组,其结果是在此数组中的每个元素上调用提供的函数."

所以,forEach实际上并没有返回任何东西.它只调用每个数组元素的函数然后就完成了.因此,无论你在被调用函数中返回什么,都会被丢弃.

另一方面,map将类似地为每个数组元素调用函数,但它不会丢弃其返回值,而是捕获它并构建这些返回值的新数组.

这也意味着您可以map在任何使用的地方使用,forEach但您仍然不应该这样做,因此您不会在没有任何目的的情况下收集返回值.如果你不需要它们,那么不收集它们会更有效率.

---

@cowbert只是因为某些东西被立即收集垃圾,这并不意味着你没有受到必要的分配的打击.所以`forEach`在概念上*仍然会更高效,更适合你不需要收集结果的任务.我不知道你,但在2015年,我不再为IE8开发了(顺便说一句,也不支持`map`); 和IE9 +支持`forEach`.实际上,在我回答一个月后,微软终止了对这些浏览器的支持.

3> Maha..：

---

+----------------+-------------------------------------+---------------------------------------+
|                | foreach                             | map                                   |
+----------------+-------------------------------------+---------------------------------------+
| Functionality  | Performs given operation on each    | Performs given "transformation" on    |
|                | element of the array                | "copy" of each element                |
+----------------+-------------------------------------+---------------------------------------+
| Return value   | Returns undefined                   | Returns new array with tranformed     |
|                |                                     | elements leaving back original array  |
|                |                                     | unchanged                             |
+----------------+-------------------------------------+---------------------------------------+
| Preferrable    | Performing non-transformation like  | Obtaining array containing output of  |
| usage scenario | processing on each element.         | some processing done on each element  |
| and example    |                                     | of the array.                         |
|                | For example, saving all elements in |                                       |
|                | the database                        | For example, obtaining array of       |
|                |                                     | lengths of each string in the         |
|                |                                     | array                                 |
+----------------+-------------------------------------+---------------------------------------+

4> Rahul Desai..：

---

您需要知道的主要区别是.map()返回一个新数组而.forEach()不是.这就是为什么你看到输出的差异..forEach()只对数组中的每个值进行操作.

阅读:

Array.prototype.forEach() - JavaScript | MDN

Array.prototype.map() - JavaScript | MDN

您可能还想看看: - Array.prototype.every()- JavaScript | MDN

5> 小智..：

---

forEach:如果要对Array的元素执行操作,它与用于for循环的操作相同.这种方法的结果并没有给我们一个输出购买只是循环通过元素.

map:如果要对数组的元素执行操作,并且还希望将操作的输出存储到Array中.这类似于在每次迭代后返回结果的函数中的for循环.

希望这可以帮助.