JS forEach和map的区别与共同之处

最新推荐文章于 2024-08-27 19:36:54 发布

YoloAva

最新推荐文章于 2024-08-27 19:36:54 发布

阅读量169

点赞数

分类专栏： JavaScript 文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/weixin_60463255/article/details/120924635

版权

JavaScript 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

这篇博客探讨了JavaScript中数组遍历方法forEach和map的共同点和不同点。它们都用于遍历数组，支持传入匿名函数，且在函数内部this指向window。主要区别在于，forEach不返回新数组，可以直接修改原数组；而map会返回一个新的数组，原数组保持不变。在性能上，map通常比forEach更快。

摘要由CSDN通过智能技术生成

共同点：
1.都是循环遍历数组的每一项，数组中有几项，那么传递进去的匿名函数就要执行几次
2.forEach()和map()里面每一次执行匿名函数都支持3个参数：数组中的当前项、当前项的索引、原始数据
3.匿名函数中的this都指向window
4.只能遍历数组

不同点：
1.总的来说，map的速度大于forEach
2.map会返回一个新的数组，不会改变原来的数组；forEach不会返回新数组，允许对原数组进行修改

//1.forEach()不会返回新数组。仅仅是遍历数组中的每一项，可以通过数组的索引来修改原来的数组。
let arr = [1, 2, 3, 4, 5];
let newArr = arr.forEach(function (item, index, input) {
            input[index] = item * 10;
        })
console.log(newArr);//=> undefined;  
console.log(arr);//=> [10, 20, 30, 40, 50]; 通过数组索引改变了原数组；

//2.map()的回调函数中支持return返回值。return相当于把原数组拷贝一份后将新数组中的对应项修改。
let arr = [1, 2, 3, 4, 5];
let newArr = arr.map(function (item, index, input) {
            return item * 10;
        })
console.log(newArr);//=> [10, 20, 30, 40, 50]; 原数组拷贝了一份，并进行了修改
console.log(arr);//=> [1, 2, 3, 4, 5]; 原数组并未发生变化