带有索引的 JavaScript foreach 示例

在 JavaScript 中，我们经常需要遍历数组或对象。foreach 方法是一种简单快捷的遍历方式，但该方法默认只提供当前元素作为参数，不提供当前元素的索引。但是，对于某些情况，我们需要同时获取当前元素的值以及索引。这篇文章将介绍如何通过轻松修改 foreach 方法，在遍历时获取索引。

常规的 foreach 示例

让我们先看一下常规的 foreach 示例：

const arr = ['apple', 'banana', 'cherry'];

arr.forEach((element) => {
  console.log(element);
});

这段代码将遍历数组 arr 并输出每一个元素的值，输出结果为：

apple
banana
cherry

修改 foreach 方法添加索引

为了让 foreach 方法返回当前元素的索引，我们需要修改一下它的回调函数，将其改为接受两个参数：当前元素和索引值。代码如下：

const arr = ['apple', 'banana', 'cherry'];

arr.forEach((element, index) => {
  console.log(index + ': ' + element);
});

在这个示例中，我们添加了参数 index，并在输出时将其和当前元素的值一并输出。输出结果为：

0: apple
1: banana
2: cherry

示例说明

这个示例展示了如何使用 foreach 方法并获取当前元素的索引。需要注意的是，在使用 foreach 方法时，回调函数的第一个参数永远是当前元素，第二个参数才是索引值，因此我们不能将这两个参数的位置搞混。

在实际开发中，带有索引的 foreach 方法非常有用，它可以方便我们在遍历数组或对象时获取当前元素的索引，使代码更加简单易读。

希望这个示例对您的开发有所帮助！