js遍历数组foreach_JavaScript forEach –如何在JS中遍历数组

js遍历数组foreach

The JavaScript forEach method is one of the several ways to loop through arrays. Each method has different features, and it is up to you, depending on what you're doing, to decide which one to use.

JavaScript forEach方法是循环遍历数组的几种方法之一。 每种方法都有不同的功能，取决于您要执行的操作，由您决定使用哪种方法。

In this post, we are going to take a closer look at the JavaScript forEach method.

在本文中，我们将仔细研究JavaScript forEach方法。

Considering that we have the following array below:

考虑到下面的数组：

const numbers = [1, 2, 3, 4, 5];

Using the traditional "for loop" to loop through the array would be like this:

使用传统的“ for循环”来遍历数组就像这样：

for (i = 0; i < numbers.length; i++) {
  console.log(numbers[i]);
}

是什么使forEach()方法与众不同？ (What makes the forEach( ) method different?)

The forEach method is also used to loop through arrays, but it uses a function differently than the classic "for loop".

forEach方法也用于循环遍历数组，但是它使用的功能与经典的“ for循环”不同。

The forEach method passes a callback function for each element of an array together with the following parameters:

forEach方法将数组的每个元素以及以下参数传递给回调函数 ：

• Current Value (required) - The value of the current array element
  当前值(必填)-当前数组元素的值
• Index (optional) - The current element's index number
  索引(可选)-当前元素的索引号
• Array (optional) - The array object to which the current element belongs
  Array(可选)-当前元素所属的数组对象

Let me explain these parameters step by step.

让我逐步解释这些参数。

Firstly, to loop through an array by using the forEach method, you need a callback function (or anonymous function):

首先，要使用forEach方法遍历数组，您需要一个回调函数(或匿名函数)：

numbers.forEach(function() {
    // code
});

The function will be executed for every single element of the array. It must take at least one parameter which represents the elements of an array:

该函数将针对数组的每个单个元素执行。 它必须至少包含一个代表数组元素的参数：

numbers.forEach(function(number) {
    console.log(number);
});

That's all we need to do for looping through the array:

这就是我们遍历数组所需要做的一切：

Alternatively, you can use the ES6 arrow function representation for simplifying the code:

另外，您可以使用ES6箭头功能表示形式来简化代码：

可选参数 (Optional Parameters)

指数 (Index)

Alright now let's continue with the optional parameters. The first one is the "index" parameter, which represents the index number of each element.

现在，让我们继续可选参数。 第一个是“索引”参数，它表示每个元素的索引号。

Basically, we can see the index number of an element if we include it as a second parameter:

基本上，如果我们将元素作为第二个参数包含进来，我们可以看到它的索引号：

numbers.forEach((number, index) => {
    console.log('Index: ' + index + ' Value: ' + number);
});

数组 (Array)

The array parameter is the array itself. It is also optional and can be used if necessary in various operations. Otherwise, if we call it, it will just get printed as many times as the number of elements of the array:

array参数是数组本身。 它也是可选的，必要时可以在各种操作中使用。 否则，如果我们调用它，它将只被打印与数组元素数量一样多的次数：

numbers.forEach((number, index, array) => {
    console.log(array);
});

You can see the example usage of the forEach( ) method in this video:

您可以在此视频中看到forEach()方法的示例用法：

浏览器支持 (Browser Support)

The Array.forEach method is supported in all browsers expect IE version 8 or earlier:

期望IE 8或更早版本的所有浏览器都支持 Array.forEach方法：

If you want to learn more about Web Development, feel free to visit my Youtube Channel.

如果您想了解有关Web开发的更多信息，请随时访问我的Youtube频道 。

Thank you for reading!

感谢您的阅读！

翻译自: https://www.freecodecamp.org/news/javascript-foreach-how-to-loop-through-an-array-in-js/

js遍历数组foreach