JavaScript中的数组循环遍历方法详解

在JavaScript中，数组是一种常用的数据结构，而循环遍历数组是处理数组中元素的常见操作。JavaScript提供了多种方法来循环遍历数组，每种方法都有其独特的特点和用途

1. for循环

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

特点：

• 最基本的循环方式，通过索引来访问数组元素。
• 可以灵活控制循环的起始点、终止条件和步长。

2. forEach方法

const array = [1, 2, 3, 4, 5];
array.forEach(item => {
    console.log(item);
});

特点：

• 用于遍历数组中的每个元素，提供了一个回调函数来处理每个元素。
• 无法使用break或continue来控制循环流程。

3. map方法

const array = [1, 2, 3, 4, 5];
const newArray = array.map(item => item * 2);
console.log(newArray);

特点：

• 遍历数组中的每个元素，并返回一个新数组，新数组的元素是对原数组元素处理后的结果。
• 不会改变原数组，而是返回一个新数组。

4. filter方法

const array = [1, 2, 3, 4, 5];
const newArray = array.filter(item => item % 2 === 0);
console.log(newArray);

特点：

• 遍历数组中的每个元素，并返回满足条件的元素组成的新数组。
• 不会改变原数组，而是返回一个新数组。

5. reduce方法

const array = [1, 2, 3, 4, 5];
const sum = array.reduce((acc, curr) => acc + curr, 0);
console.log(sum);

特点：

• 从数组的第一个元素开始，逐个遍历数组元素，累积处理每个元素的结果。
• 可以用于累加、累乘等操作。

6. for...in循环

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

特点：

• 遍历对象的可枚举属性，也可以用于遍历数组。
• 不推荐用于数组遍历，因为会遍历数组的所有可枚举属性，包括原型链上的属性。

7. for...of循环

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

特点：

• 用于遍历可迭代对象（如数组、字符串、Map、Set等）的值。
• 不需要访问索引，更简洁易读。

8. while循环

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

特点：

• 通过设置循环条件来遍历数组元素。
• 需要手动管理循环变量，适合在不确定循环次数的情况下使用。