在前端开发中，遍历数组元素是一种非常常见且重要的操作。ES6 中引入了很多方便的方法来处理数组，比如 map、filter、reduce 等，这些方法都可以减少我们对数组元素的复杂操作。
而在 ECMAScript 2019 中， Array.prototype.forEach 方法也得到了很多的优化，使得它变得更加强大、快速以及易用。
遍历数组元素
forEach 方法可以接受一个函数作为参数，这个函数将会被调用一次数组中的每个元素，从第一个元素开始，直到数组的最后一个元素。
函数接受三个参数：
- 数组元素的值。
- 数组元素的索引。
- 数组本身。
示例代码如下：
const arr = [1, 2, 3, 4, 5];
// 使用 forEach 遍历数组
arr.forEach((item, index, array) => {
console.log(`第 ${index + 1} 个元素是：${item}`)
});上述代码将会输出如下结果：
第 1 个元素是：1 第 2 个元素是：2 第 3 个元素是：3 第 4 个元素是：4 第 5 个元素是：5
数组元素变化
在 ECMAScript 2019 中，forEach 方法还支持在遍历数组的过程中修改数组元素。原因是新版的 forEach 方法在遍历时，会先创建一个新的数组，然后将原数组元素依次复制到新数组中，最后将新数组赋值给原数组。
以下是修改数组元素的示例代码：
const arr = [1, 2, 3, 4, 5];
// 使用 forEach 修改数组元素
arr.forEach((item, index, array) => {
array[index] = item * 2;
});
console.log(arr); // 输出 [2, 4, 6, 8, 10]在上面的代码中，我们将数组元素依次乘以 2，并将结果赋值给原数组。最后，我们通过 console.log 将修改后的结果输出，可以看到数组的元素已经被成功修改了。
中断循环
forEach 方法是不支持中断循环的，但是我们可以使用 try...catch 语句来实现中断循环的效果。具体操作是在 try 语句块中使用 throw 语句抛出一个自定义的错误，然后在 catch 语句块中捕获这个错误，并根据需要进行处理。
以下是中断循环的示例代码：
-- -------------------- ---- -------
----- --- - --- -- -- -- ---
-- -------
--- -
------------------ ------ ------ -- -
-- ----- --- -- -
----- --- ------------------
-
------------------
--
- -------- -
-----------------------
-我们在遍历数组的过程中，如果找到了数组中值为 4 的元素，就抛出一个错误。然后我们在 catch 语句块中捕获这个错误，并输出错误信息。
以上代码的输出结果是：
1 2 3 找到了想要的元素
可以看到，当我们找到符合条件的元素后，就直接中断了循环，并输出了相应的错误信息。
总结
forEach 方法是 ECMAScript 2019 中数组操作的一个重要方法，它能够方便地遍历数组元素，还可以支持修改数组元素。通过学习和使用 forEach 方法，我们能够更加轻松地完成前端开发中的数组操作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a38d1048841e9894fe9383