前言

大家好,最近在学习算法的时候，遇到数组需要进行符合数据集提取的时候查询了一下数组中的迭代方法，好家伙，这么多(╥﹏╥)，不同的迭代方法使用的场景也不同，今天就和大家分享一下数组中的迭代方法和使用场景以及注意事项。话不多说，开始分享享̗̀(๑ᵔᗜᵔ๑)！

1. Array.prototype.reduce()

返回的结果

reduce() 方法对数组中的每个元素（顺序）应用一个回调函数，上一个元素对应的函数返回值将会被下一个元素的函数给接收，不懂的话可以等会看看参数详解。

方法解析

reduce() 通过回调函数对数组中的每个元素执行一个操作，将所有值累积到一个单一的返回值中。此回调函数接收四个参数：累加器（accumulator）、当前值（currentValue）、当前索引（currentIndex）和源数组（array）。此外，还可以提供一个初始值作为reduce()的第二个参数。

回调方法参数

• 回调函数：(accumulator, currentValue, currentIndex, arr)
• 可选的初始值 这里的函数长得是这个样子 arr.reduce((accumulator,currentValue,currentIndex,arr)=>{return xxxxx;} ,beginValue) 这里的accumulator就是上一次函数的返回值，currentValue就是当前遍历的元素，currentIndex就是当前遍历的下标，arr就是原数组 此时我就要自问自答了- ̗̀(๑ᵔ⌔ᵔ๑)，楼主楼主那遍历第一个元素的时候哪里来的函数返回值呢？ 咳咳，这里就是beginValue的作用了，如果给了就是使用beginValue作为第一个元素接受的accumulator，没有的话就会直接使用第一个元素作为第二个元素的接受返回结果，第一个元素没有相对应的回调函数。看看下面的示例来详细理解。

示例

//给了beginValue
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => {
    return accumulator+=2*currentValue;
}, 0);
console.log(sum);
// sum ===> 20;

------------------------------------------------------------------
//没有给beginValue
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => {
    return accumulator +=2*currentValue;
});
console.log(sum);
// sum ===> 19; //第一个元素并没有执行对应的回调函数，直接从第二个开始

2. Array.prototype.filter()

返回的结果

filter() 方法返回一个新数组，包含所有通过测试（即回调函数返回 true）的元素。

方法解析

filter() 遍历数组中的每一项元素，对每个元素执行提供的测试函数。如果测试函数返回 true，则该元素会被包含在返回的新数组中。遍历完成后，filter() 返回一个仅包含满足条件元素的新数组。

回调方法参数

同样接受三个参数：当前值（val）、当前索引（index）和源数组（arr）。

示例

const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = numbers.filter((value, index, arr) => {
    return value % 2 === 0;
});
console.log(evenNumbers);
// evenNumbers ===> [2, 4, 6];

3. Array.prototype.some()

返回的结果

some() 是数组显示原型上面的方法，使用这个方法返回的是一个Boolean值

方法解析

some() 方法遍历数组中所有的数据，每次遍历都会执行一个回调函数返回一个Boolean值。直到某次遍历返回的Boolean值为true，将会停止迭代遍历直接返回结果true。如果遍历所有都没有找到满足条件的元素，则返回 false。

回调方法参数

some() 方法三个参数：分别是 当前值（val）,当前下标(index),源数组(arr)

示例

const arr = [1,2,'a',4,5];
const result = arr.some((value,index,arr)=>{
    if(value=='a')return true;
})
console.log(result);
//result ====> true;

4. Array.prototype.every()

返回的结果

every() 方法返回一个布尔值，表示数组中的所有元素是否都满足测试函数的条件。和some（）不同，一个是有true就直接返回true，另一个是有false就直接返回false;

方法解析

every() 会遍历数组中的每一个元素，对每个元素执行一个测试函数。如果所有元素都使得测试函数返回 true，则 every() 返回 true；只要有任意一个元素使得测试函数返回 false，则立刻停止遍历并返回 false。

回调方法参数

接收三个参数：当前值（val）、当前索引（index）和源数组（arr）。

示例

Javascript
const numbers = [2, 4, 6, 8, 9];
const allEven = numbers.every((value) => {
    return value % 2 === 0;
});
console.log(allEven); // allEven ===> false;

5. Array.prototype.map()

返回的结果

map() 方法返回一个新数组，新数组中的元素是原数组每个元素经过回调函数处理后(return)的结果。

方法解析

map() 会遍历数组中的每个元素，对每个元素执行提供的回调函数，并将返回的结果收集到一个新数组中返回。此过程不会改变原数组。

回调方法参数

同样接收三个参数：当前值（val）、当前索引（index）和源数组（arr）。

示例

const names = ['Alice', 'Bob', 'Charlie'];
const uppercaseNames = names.map((name, index, arr) => {
    return name.toUpperCase();
});
console.log(uppercaseNames);
// uppercaseNames ===> ['ALICE', 'BOB', 'CHARLIE'];

6. Array.prototype.forEach()

返回的结果

forEach() 不直接返回任何值（返回 undefined），主要作用是遍历数组并对每个元素执行操作。

方法解析

forEach() 方法遍历数组中的每一项，并对每一项执行一个提供的函数。此方法主要用于进行数组元素的遍历操作，而无需关注返回值。

回调方法参数

同样包括当前值（val）、当前索引（index）和源数组（arr）。

示例

Javascript
const items = ['apple', 'banana', 'cherry'];
items.forEach((item, index, arr) => {
    console.log(`Item at index ${index}: ${item}`);
});
// 输出:
// Item at index 0: apple
// Item at index 1: banana
// Item at index 2: cherry

7. Array.prototype.find()

返回的结果

find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

方法解析

find() 会遍历数组中的元素，对每个元素执行测试函数，直到找到一个使得测试函数返回 true 的元素，此时 find() 将返回该元素。若无满足条件的元素，则返回 undefined。

回调方法参数

同样接受三个参数：当前值（val）、当前索引（index）和源数组（arr）。

示例

const users = [
    { id: 1, name: 'Alice' },
    { id: 2, name: 'Bob' },
    { id: 3, name: 'Charlie' }
];

const user = users.find((userObj) => {
    return userObj.id === 2;
});
console.log(user); // user ===> { id: 2, name: 'Bob' };

8. Array.prototype.findIndex()

返回的结果

findIndex() 方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回 -1。

方法解析

类似于 find()，findIndex() 也是遍历数组，寻找第一个使测试函数返回 true 的元素，并返回该元素的索引。若无满足条件的元素，则返回 -1。

回调方法参数

同样包含三个参数：当前值（val）、当前索引（index）和源数组（arr）。

示例

const names = ['Alice', 'Bob', 'Charlie'];
const index = names.findIndex(name => name === 'Bob');
console.log(index); // index ===> 1;

结语

虽然 includes, indexOf, 和 lastIndexOf 这些方法在功能上是为了查找数组中元素的存在与否以及位置，它们在内部确实也遍历了数组来完成这一任务，但严格意义上讲，它们并不属于典型的“迭代方法”分类，这里就不进行过多讨论。 如果还喜欢的话，就关注点赞和收藏这篇文章吧，希望下次还能分享优秀文章给你们，谢谢♡⸜(˶˃ ᵕ ˂˶)⸝♡