JavaScript的forEach循环对数组对象

在 JavaScript 中，forEach() 是一个用于数组对象的迭代方法。它可以遍历数组中的每个元素，并执行指定的函数来处理每个元素。在本文中，我们将深入探讨 forEach() 的使用方法和一些有用的技巧。

基本语法

forEach() 方法需要传递一个回调函数作为参数。该回调函数拥有三个参数：当前元素值、当前元素下标和整个数组对象。以下是基本的语法示例：

array.forEach(function(currentValue, index, array) {
  // 处理每个元素的函数体
});

forEach() vs. for 循环

相比较于常规的 for 循环，forEach() 有一些优势。首先，它使代码更加简洁易读，因为不需要手动设置循环条件和步进器。其次， forEach() 方法会自动跳过那些值为 undefined 的数组元素。最后，由于 forEach() 方法是一个高阶函数，因此可以轻松地通过链式调用实现多个操作。

使用 forEach() 进行元素修改

forEach() 可以被用于修改数组中的元素。例如，在下面的示例中，我们将数组中的每个元素都乘以 2：

const numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(num, index, arr) {
  arr[index] = num * 2;
});
console.log(numbers); // [2, 4, 6, 8, 10]

请注意，我们在函数体内使用 arr[index] 来更新数组中的元素。

使用 forEach() 进行元素过滤

forEach() 同样可以用于过滤数组中的元素。但是，由于它没有返回一个新的数组，因此需要使用条件语句来手动过滤掉不需要的元素。以下是一个例子：

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = [];
numbers.forEach(function(num) {
  if (num % 2 === 0) {
    evenNumbers.push(num);
  }
});
console.log(evenNumbers); // [2, 4]

使用箭头函数

由于 forEach() 是一个高阶函数，因此可以轻松地将其与 ES6 中的箭头函数结合使用。这使得代码更加简洁易读。例如，我们可以使用箭头函数来实现上述示例：

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = [];
numbers.forEach(num => {
  if (num % 2 === 0) {
    evenNumbers.push(num);
  }
});
console.log(evenNumbers); // [2, 4]

总结

forEach() 是一个非常有用的方法，可以用于遍历、修改和过滤数组中的元素。它相对于常规的 for 循环更加简洁易读，并且可以通过链式调用进行多个操作。我们可以将它与箭头函数结合使用，使代码更加简洁易懂。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/10246