73 - 内置对象 - Array 对象 - 数组的迭代方法使用

前端 - Javascript 《内置对象 - Array 对象 - 数组的迭代方法使用》

在 JavaScript 的世界里，数组是一种非常常用的数据结构，而数组的迭代方法就像是一把神奇的钥匙，能帮助我们更高效地处理数组中的元素。今天，我们就来探索一下这些强大的数组迭代方法。

1. forEach 方法

forEach 方法可以让我们遍历数组中的每个元素，并对每个元素执行一次提供的函数。它就像是一个勤劳的小工，逐个访问数组里的元素。

const numbers = [1, 2, 3, 4, 5];
numbers.forEach(function (number) {
    console.log(number * 2);
});

在这个例子中，forEach 方法会依次取出 numbers 数组中的每个元素，将其乘以 2 并打印出来。不过要注意，forEach 方法没有返回值，它只是单纯地执行操作。

2. map 方法

map 方法会创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。可以把它想象成一个神奇的转换器，将原数组的元素转换为新的形式。

const numbers = [1, 2, 3, 4, 5];
const squaredNumbers = numbers.map(function (number) {
    return number * number;
});
console.log(squaredNumbers);

这里，map 方法将 numbers 数组中的每个元素平方后，存储在 squaredNumbers 新数组中。

3. filter 方法

filter 方法会创建一个新数组，其中包含所有通过所提供函数实现的测试的元素。它就像一个严格的筛选器，只让符合条件的元素通过。

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(function (number) {
    return number % 2 === 0;
});
console.log(evenNumbers);

在这个例子中，filter 方法筛选出了 numbers 数组中的偶数，存储在 evenNumbers 数组中。

4. reduce 方法

reduce 方法对数组中的每个元素执行一个由您提供的 reducer 函数，将其结果汇总为单个返回值。它就像是一个超级计算器，能把数组元素进行累加或其他复杂的计算。

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce(function (accumulator, currentValue) {
    return accumulator + currentValue;
}, 0);
console.log(sum);

这里，reduce 方法从初始值 0 开始，将数组中的元素依次累加，最终得到总和。

总结表格

通过这些强大的数组迭代方法，我们可以用更简洁、更高效的方式处理数组。无论是简单的遍历、转换，还是复杂的筛选和汇总，它们都能轻松应对。掌握这些方法，会让你的 JavaScript 编程之路更加顺畅，就像拥有了一把万能钥匙，开启数组处理的新大门。所以，赶快在代码中试试这些神奇的迭代方法吧！