关于JavaScript 进行遍历数组的六种常见方法 这件事

方法一：for 循环#

for 循环是 JavaScript 中最基本和常用的循环结构之一。它是通过指定一个计数器变量、循环条件和计数器更新的逻辑来实现循环的。

示例代码：

const array = [1, 2, 3, 4, 5];
for (let i = 0; i < array.length; i++) {
  console.log(array[i]);//输出 1, 2, 3, 4, 5
}

方法二：forEach 方法#

forEach 方法是数组的一个内置方法，它会对数组中的每个元素执行一次提供的函数。

示例代码：

const array = [1, 2, 3, 4, 5];
array.forEach((element,key) => {
  console.log(element);//输出 1, 2, 3, 4, 5
});

方法三：for...in 循环#

for...in 循环用于遍历对象的可枚举属性，但也可以用于数组。不过需要注意的是，for...in 循环会遍历所有可枚举属性，包括可能的继承属性，而不只是数组元素。

示例代码：

const array = [1, 2, 3, 4, 5];
for (let index in array) {
  console.log(array[index]);//输出 1, 2, 3, 4, 5
}

方法四：for...of 循环#

for...of 循环是 ES6 引入的一种新的循环结构，用于遍历可迭代对象（如数组）的值。

示例代码：

const array = [1, 2, 3, 4, 5];
for (let element of array) {
  console.log(element);//输出 1, 2, 3, 4, 5
}

方法五：map 方法#

map 方法是数组的一个内置方法，它会对数组中的每个元素调用一个提供的函数，并返回一个新数组。

示例代码：

const array = [1, 2, 3, 4, 5];
const newArray = array.map((element) => {
  return element * 2;
});
console.log(newArray); // 输出：[2, 4, 6, 8, 10]

方法六：filter 方法#

filter 方法是数组的一个内置方法，它会对数组中的每个元素调用一个提供的函数，并返回一个新数组，其中包含所有使函数返回 true 的元素。

示例代码：

const array = [1, 2, 3, 4, 5];
const newArray = array.filter((element) => {
  return element > 2;
});
console.log(newArray); // 输出：[3, 4, 5]

方法七：reduce 方法#

reduce 方法是数组的一个内置方法，它会对数组中的每个元素调用一个提供的函数，并返回一个单个值。

示例代码：

const array = [1, 2, 3, 4, 5];
const sum = array.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0);
console.log(sum); // 输出：15