JavaScript 中 forEach() 和 Map() 的区别

大家好，今天我们来聊聊一些对于大多数初学者来说可能比较模糊的高级 JS 数组函数。

下面是这些数组函数的代码片段，

array.forEach((item) => {
      // your code
});const mapArr = array.map((item) => {
     // some code
     return;   //In map() function must always return some value
});

在这里， forEach() 只是循环一些东西，它会执行函数所说的任何事情。并且使用 map() 我们遍历每个项目并返回一个新数组。

嘿，两者似乎做同样的事情，对吧？但它们之间有一个关键的区别。每当我们想要做一个简单的循环并对我们使用 map() 的数组执行操作时，它对操作有限制，它期望操作返回一个元素。本质上，map() 遍历一个数组，对每个元素应用操作，最后将每次调用操作的结果存储到另一个数组中。另一方面，使用 forEach() 操作可能什么也不做，我们可以完全留空或在控制台上打印一些东西，因为所有 forEach() 关心的是遍历元素集合并应用我们告诉它的任何操作对每个元素做。换句话说，map() 转换数组并从中创建一个新数组，而 foreEach() 基于数组执行一系列操作。

在 forEach() 中，要返回一个新数组，我们必须首先创建自己的数组，然后将这些元素压入其中。

让我们通过一个例子来理解，

const arr = [1, 2, 3, 4]
const squaredArr = [];
arr.forEach((item) => {
squaredArr.push(item * item)
})

在上面的代码中，我们创建了一个单独的数组来存储操作的值。 现在让我们看看它在 map() 中的样子，

const squaredArr = arr.map((item) => {
return item * item;
})

现在就是这样。

感谢您抽出时间来阅读！ 希望这篇文章对您有所帮助，稍后再见！