在JavaScript中，数组是一种非常常见的数据结构，用于存储和操作一组有序的数据。为了更方便地处理数组中的数据，JavaScript提供了多种迭代处理方法。这些方法可以帮助开发者更高效地遍历、过滤、映射、排序和聚合数组中的元素。本文将详细介绍JavaScript中数组常用的迭代处理方法，并通过示例代码展示它们的用法。
forEach 方法forEach 方法用于遍历数组中的每个元素，并对每个元素执行指定的操作。它不会返回新的数组，而是直接对原数组进行操作。
array.forEach(callback(currentValue, index, array), thisArg);
callback: 为数组中的每个元素执行的函数，该函数接收三个参数：
currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 forEach 的数组。thisArg (可选): 执行 callback 时使用的 this 值。const numbers = [1, 2, 3, 4, 5];
numbers.forEach((number, index) => {
console.log(`Index: ${index}, Value: ${number}`);
});
Index: 0, Value: 1
Index: 1, Value: 2
Index: 2, Value: 3
Index: 3, Value: 4
Index: 4, Value: 5
forEach 方法不会改变原数组，但可以在回调函数中修改数组元素。forEach 方法无法中断遍历，即使使用 return 或 break 也无法提前退出循环。map 方法map 方法用于遍历数组中的每个元素，并对每个元素执行指定的操作，最后返回一个新的数组，新数组中的元素是原数组元素经过回调函数处理后的结果。
array.map(callback(currentValue, index, array), thisArg);
callback: 为数组中的每个元素执行的函数，该函数接收三个参数：
currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 map 的数组。thisArg (可选): 执行 callback 时使用的 this 值。const numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.map((number) => {
return number * 2;
});
console.log(doubledNumbers); // 输出: [2, 4, 6, 8, 10]
map 方法不会改变原数组，而是返回一个新的数组。map 方法适用于需要对数组中的每个元素进行转换的场景。filter 方法filter 方法用于遍历数组中的每个元素，并根据指定的条件筛选出符合条件的元素，最后返回一个新的数组。
array.filter(callback(currentValue, index, array), thisArg);
callback: 为数组中的每个元素执行的函数，该函数接收三个参数：
currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 filter 的数组。thisArg (可选): 执行 callback 时使用的 this 值。const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter((number) => {
return number % 2 === 0;
});
console.log(evenNumbers); // 输出: [2, 4]
filter 方法不会改变原数组，而是返回一个新的数组。filter 方法适用于需要根据条件筛选数组元素的场景。reduce 方法reduce 方法用于遍历数组中的每个元素，并将数组中的元素累积为一个单一的值。reduce 方法接收一个回调函数和一个初始值作为参数，回调函数会对数组中的每个元素执行累积操作。
array.reduce(callback(accumulator, currentValue, index, array), initialValue);
callback: 为数组中的每个元素执行的函数，该函数接收四个参数：
accumulator: 累积器，累积回调函数的返回值。currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 reduce 的数组。initialValue (可选): 作为第一次调用 callback 函数时的第一个参数的值。如果没有提供初始值，则将使用数组中的第一个元素作为初始值。const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, currentValue) => {
return accumulator + currentValue;
}, 0);
console.log(sum); // 输出: 15
reduce 方法不会改变原数组，而是返回一个累积后的值。reduce 方法适用于需要对数组中的元素进行累积操作的场景，如求和、求积等。reduceRight 方法reduceRight 方法与 reduce 方法类似，但它从数组的末尾开始遍历数组，而不是从数组的开头。
array.reduceRight(callback(accumulator, currentValue, index, array), initialValue);
callback: 为数组中的每个元素执行的函数，该函数接收四个参数：
accumulator: 累积器，累积回调函数的返回值。currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 reduceRight 的数组。initialValue (可选): 作为第一次调用 callback 函数时的第一个参数的值。如果没有提供初始值，则将使用数组中的最后一个元素作为初始值。const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduceRight((accumulator, currentValue) => {
return accumulator + currentValue;
}, 0);
console.log(sum); // 输出: 15
reduceRight 方法不会改变原数组，而是返回一个累积后的值。reduceRight 方法适用于需要从数组末尾开始累积操作的场景。every 方法every 方法用于检查数组中的每个元素是否都满足指定的条件。如果所有元素都满足条件，则返回 true，否则返回 false。
array.every(callback(currentValue, index, array), thisArg);
callback: 为数组中的每个元素执行的函数，该函数接收三个参数：
currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 every 的数组。thisArg (可选): 执行 callback 时使用的 this 值。const numbers = [1, 2, 3, 4, 5];
const allEven = numbers.every((number) => {
return number % 2 === 0;
});
console.log(allEven); // 输出: false
every 方法不会改变原数组。every 方法适用于需要检查数组中的所有元素是否都满足某个条件的场景。some 方法some 方法用于检查数组中是否至少有一个元素满足指定的条件。如果至少有一个元素满足条件，则返回 true，否则返回 false。
array.some(callback(currentValue, index, array), thisArg);
callback: 为数组中的每个元素执行的函数，该函数接收三个参数：
currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 some 的数组。thisArg (可选): 执行 callback 时使用的 this 值。const numbers = [1, 2, 3, 4, 5];
const hasEven = numbers.some((number) => {
return number % 2 === 0;
});
console.log(hasEven); // 输出: true
some 方法不会改变原数组。some 方法适用于需要检查数组中是否至少有一个元素满足某个条件的场景。find 方法find 方法用于查找数组中第一个满足指定条件的元素。如果找到满足条件的元素，则返回该元素，否则返回 undefined。
array.find(callback(currentValue, index, array), thisArg);
callback: 为数组中的每个元素执行的函数，该函数接收三个参数：
currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 find 的数组。thisArg (可选): 执行 callback 时使用的 this 值。const numbers = [1, 2, 3, 4, 5];
const firstEven = numbers.find((number) => {
return number % 2 === 0;
});
console.log(firstEven); // 输出: 2
find 方法不会改变原数组。find 方法适用于需要查找数组中第一个满足某个条件的元素的场景。findIndex 方法findIndex 方法用于查找数组中第一个满足指定条件的元素的索引。如果找到满足条件的元素，则返回该元素的索引，否则返回 -1。
array.findIndex(callback(currentValue, index, array), thisArg);
callback: 为数组中的每个元素执行的函数，该函数接收三个参数：
currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 findIndex 的数组。thisArg (可选): 执行 callback 时使用的 this 值。const numbers = [1, 2, 3, 4, 5];
const firstEvenIndex = numbers.findIndex((number) => {
return number % 2 === 0;
});
console.log(firstEvenIndex); // 输出: 1
findIndex 方法不会改变原数组。findIndex 方法适用于需要查找数组中第一个满足某个条件的元素的索引的场景。includes 方法includes 方法用于检查数组中是否包含指定的元素。如果包含，则返回 true，否则返回 false。
array.includes(searchElement, fromIndex);
searchElement: 需要查找的元素。fromIndex (可选): 开始查找的索引位置，默认为 0。const numbers = [1, 2, 3, 4, 5];
const includesThree = numbers.includes(3);
console.log(includesThree); // 输出: true
includes 方法不会改变原数组。includes 方法适用于需要检查数组中是否包含某个元素的场景。indexOf 方法indexOf 方法用于查找数组中指定元素的第一个索引。如果找到，则返回该元素的索引，否则返回 -1。
array.indexOf(searchElement, fromIndex);
searchElement: 需要查找的元素。fromIndex (可选): 开始查找的索引位置，默认为 0。const numbers = [1, 2, 3, 4, 5];
const indexOfThree = numbers.indexOf(3);
console.log(indexOfThree); // 输出: 2
indexOf 方法不会改变原数组。indexOf 方法适用于需要查找数组中某个元素的索引的场景。lastIndexOf 方法lastIndexOf 方法用于查找数组中指定元素的最后一个索引。如果找到，则返回该元素的索引，否则返回 -1。
array.lastIndexOf(searchElement, fromIndex);
searchElement: 需要查找的元素。fromIndex (可选): 开始查找的索引位置，默认为数组的最后一个索引。const numbers = [1, 2, 3, 4, 5, 3];
const lastIndexOfThree = numbers.lastIndexOf(3);
console.log(lastIndexOfThree); // 输出: 5
lastIndexOf 方法不会改变原数组。lastIndexOf 方法适用于需要查找数组中某个元素的最后一个索引的场景。sort 方法sort 方法用于对数组中的元素进行排序。默认情况下，sort 方法会将数组元素转换为字符串，然后按照字符的Unicode码点进行排序。
array.sort(compareFunction);
compareFunction (可选): 用于指定排序顺序的函数。该函数接收两个参数 a 和 b，分别表示要比较的两个元素。如果 a 应该排在 b 前面，则返回一个负数；如果 a 应该排在 b 后面，则返回一个正数；如果 a 和 b 相等，则返回 0。const numbers = [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5];
numbers.sort((a, b) => {
return a - b;
});
console.log(numbers); // 输出: [1, 1, 2, 3, 3, 4, 5, 5, 5, 6, 9]
sort 方法会改变原数组。sort 方法适用于需要对数组中的元素进行排序的场景。reverse 方法reverse 方法用于反转数组中的元素顺序。
array.reverse();
const numbers = [1, 2, 3, 4, 5];
numbers.reverse();
console.log(numbers); // 输出: [5, 4, 3, 2, 1]
reverse 方法会改变原数组。reverse 方法适用于需要反转数组元素顺序的场景。flat 方法flat 方法用于将嵌套的数组“扁平化”，即将多维数组转换为一维数组。
array.flat(depth);
depth (可选): 指定要扁平化的嵌套层数，默认为 1。const numbers = [1, [2, [3, [4, 5]]]];
const flattenedNumbers = numbers.flat(2);
console.log(flattenedNumbers); // 输出: [1, 2, 3, [4, 5]]
flat 方法不会改变原数组，而是返回一个新的数组。flat 方法适用于需要将多维数组转换为一维数组的场景。flatMap 方法flatMap 方法结合了 map 和 flat 方法的功能。它首先对数组中的每个元素执行 map 操作，然后将结果“扁平化”为一维数组。
array.flatMap(callback(currentValue, index, array), thisArg);
callback: 为数组中的每个元素执行的函数，该函数接收三个参数：
currentValue: 当前处理的元素。index (可选): 当前处理元素的索引。array (可选): 调用 flatMap 的数组。thisArg (可选): 执行 callback 时使用的 this 值。const numbers = [1, 2, 3];
const doubledAndFlattened = numbers.flatMap((number) => {
return [number, number * 2];
});
console.log(doubledAndFlattened); // 输出: [1, 2, 2, 4, 3, 6]
flatMap 方法不会改变原数组，而是返回一个新的数组。flatMap 方法适用于需要对数组中的每个元素进行映射并扁平化结果的场景。entries 方法entries 方法返回一个数组迭代器对象，该对象包含数组中每个元素的键值对。
array.entries();
const numbers = [1, 2, 3];
const iterator = numbers.entries();
for (const [index, value] of iterator) {
console.log(`Index: ${index}, Value: ${value}`);
}
Index: 0, Value: 1
Index: 1, Value: 2
Index: 2, Value: 3
entries 方法不会改变原数组。entries 方法适用于需要遍历数组的键值对的场景。keys 方法keys 方法返回一个数组迭代器对象，该对象包含数组中每个元素的键（索引）。
array.keys();
const numbers = [1, 2, 3];
const iterator = numbers.keys();
for (const key of iterator) {
console.log(`Key: ${key}`);
}
Key: 0
Key: 1
Key: 2
keys 方法不会改变原数组。
-免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
