JavaScript 中 forEach 方法详解-JavaScript中文网-JavaScript教程资源分享门户

前言

JavaScript 中的 forEach 是一个非常常用的方法，它可以很方便地遍历数组中的元素并执行相应操作，让代码看起来更加简洁。本文将详细介绍 forEach 方法的语法、实现方式、使用场景以及注意事项，希望能为初学者提供一些指导意义。

forEach 方法语法

JavaScript 中的 forEach 方法是数组原型的一个方法，它的语法如下：

array.forEach(function(currentValue,index,arr), thisValue)

其中，array 代表需要遍历的数组，这个数组可以是任何类型的数组，包括字符串等；currentValue 是用于存储当前数组元素的值；index 是用于存储当前数组元素的索引；arr 是指原始的数组对象；thisValue 是可选的，表示执行回调函数时 this 的值。

forEach 方法实现方式

forEach 方法的实现方式可以分为两种，一种是通过 for 循环来遍历数组，另一种是通过数组本身的原型方法来实现，这里我们只介绍第二种方式。

forEach 方法的实现方式如下：

-- -------------------- ---- -------
----------------------- - ------------------ -------- -
    --- -- --
    -- ----- -- ----- -
        ----- --- --------------- -- ---- -- ------------
    -
    --- - - -------------
    --- --- - -------- --- --
    -- ------- -------- --- ----------- -
        ----- --- ------------------ - - -- --- - -----------
    -
    -- ----------------- - -- -
        - - --------
    -
    - - --
    ----- -- - ---- -
        --- -------
        -- -- -- -- -
            ------ - -----
            ---------------- ------- -- ---
        -
        ----
    -
--

forEach 方法的使用场景

forEach 方法常常用于处理数组中的每个元素，例如遍历数组中的元素进行操作、筛选符合条件的元素等等。

遍历数组

可以使用 forEach 方法来遍历数组，例如：

var arr = [1, 2, 3, 4, 5];
arr.forEach(function(element) {
  console.log(element);
});

上述代码会输出数组 arr 中的每一个元素。

对每一个元素进行操作

可以使用 forEach 方法来对每一个元素进行操作，例如：

var arr = [1, 2, 3, 4, 5];
arr.forEach(function(element, index) {
  arr[index] = element * 2;
});

上述代码会将数组 arr 中的每个元素都乘以 2。

筛选符合条件的元素

可以使用 forEach 方法来对数组进行筛选，例如：

var arr = [1, 2, 3, 4, 5];
var evenNum = [];
arr.forEach(function(element) {
  if (element % 2 === 0) {
    evenNum.push(element);
  }
});

上述代码会将数组 arr 中的偶数元素放到新数组 evenNum 中。

注意事项

在回调函数中不能使用 break 和 continue 语句；
无法在 forEach 方法中使用 return 关键词来直接停止整个循环；
forEach 方法无法改变原数组。如果需要改变原数组，需要在回调函数中直接修改。

示例代码

下面是一个完整的示例代码，它演示了如何使用 forEach 方法来遍历数组中的每个元素并使用回调函数对其进行操作。

-- -------------------- ---- -------
--- --- - --- -- -- -- ---
--- ------- - ---
----------------------------- ------ -
  -- -------- - - --- -- -
    ----------------------
  -
  ---------- - ------- - --
---
--------------------- -- --- --
----------------- -- --- -- -- -- ---

总结

本文介绍了 JavaScript 中 forEach 方法的语法、实现方式、使用场景以及注意事项，并给出了一个完整的示例代码。掌握了 forEach 方法后，我们可以更方便地遍历数组中的元素以及进行相应的操作。

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