深入理解JS遍历数组的常用方法，从新手到高手

2024-02-11 19:32:20

1. for循环：古老而可靠的方法

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

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

for循环是一种经典的遍历方法，可以按顺序访问数组中的每个元素。通过使用变量i来控制循环次数，我们能够逐个打印出数组中的数字。

2. forEach：简洁高效的遍历利器

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

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

forEach方法是ES5中引入的一种新颖遍历方式。它接受一个回调函数作为参数，该函数将对数组中的每个元素执行指定的处理。forEach方法的优势在于代码简洁、易于阅读和理解。

3. map：将数组元素一一映射到新数组

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

const doubledNumbers = numbers.map((number) => {
  return number * 2;
});

console.log(doubledNumbers); // [2, 4, 6, 8, 10]

map方法可以将数组中的每个元素通过一个映射函数处理，并返回一个包含新元素的新数组。在新数组中，每个元素都是通过对原始数组中的相应元素应用映射函数而得到的。

4. filter：筛选出符合条件的元素

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

const evenNumbers = numbers.filter((number) => {
  return number % 2 === 0;
});

console.log(evenNumbers); // [2, 4]

filter方法用于从数组中筛选出符合指定条件的元素，并返回一个包含这些元素的新数组。在上面的例子中，我们使用filter方法将偶数从数组中筛选出来。

5. reduce：将数组元素累积为单个值

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

const sum = numbers.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
});

console.log(sum); // 15