在JavaScript中内置了许多数组可用的迭代方法。
在本文例子中，我们需要用到的数组都为以下 numbers 数组，就不每个函数一一写出

1
let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

every() 方法迭代

  • every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。
  • every() 方法使用指定函数检测数组中的所有元素：
    • 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
    • 如果所有元素都满足条件，则返回 true。

tips:
every() 不会对空数组进行检测。
every() 不会改变原始数组。

语法：

1
array.every(function(currentValue,index,arr), thisValue)

示例：
我们判断numbers是不是全是偶数。

1
2
3
let isAllEven = numbers.every(x => x % 2 === 0);

console.log(isAllEven)  // false

数组的第一个元素是1，它不是2的倍数(1是奇数)，因此函数返回false，然后every执行结束

some() 方法迭代

  • some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。
  • some() 方法会依次执行数组的每个元素：
    • 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
    • 如果没有满足条件的元素，则返回false。

示例：
我们判断numbers数组是否有偶数

1
2
let hasEven = numbers.some(x => x % 2 === 0)
console.log(hasEven);  // true

在这个例子中，numbers数组的第二个元素是2（为偶数），所以第二个被迭代的元素返回true。迭代结束

forEach() 方法迭代

forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。
注：**forEach() 本身是不支持的 continue 与 break 语句的**

示例：
我们来判断一下numbers数组里每个元素的奇偶

1
2
3
numbers.forEach(x => {
    console.log(`数字${x}为${x % 2 === 0 ? '偶数' : '奇数'}`);
})

使用forEach和使用for循环的结果相同

map() 方法迭代

  • map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
  • map() 方法按照原始数组元素顺序依次处理元素。

示例：
获取numbers数组每个元素的奇偶性组成新数组：

1
2
const myMap = numbers.map(x => x % 2 === 0);
console.log(myMap) // [false, true, false, true, false, true, false, true, false, true]

filter() 方法迭代

filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

示例：
我们获取numbers所有偶数组成新数组：

1
2
const evenNumbers = numbers.filter(x => x % 2 === 0);
console.log(evenNumbers) // [ 2, 4, 6, 8, 10 ]

Tips:

以上方法的语法均为：

1
[数组].[方法名](function(currentValue,index,arr), thisValue)

参数详解：

参数描述
function(currentValue, index,arr)必须。函数，数组中的每个元素都会执行这个函数
函数参数:
参数描述
currentValue必须。当前元素的值
index可选。当前元素的索引值
arr可选。当前元素属于的数组对象
</td>
thisValue可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。

reduce() 方法迭代

  • reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
  • reduce() 可以作为一个高阶函数，用于函数的 compose。

语法：

1
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数详解:

参数描述
function(total,currentValue, index,arr)必需。用于执行每个数组元素的函数。
函数参数:
参数描述
total必需。初始值, 或者计算结束后的返回值。
currentValue必需。当前元素
currentIndex可选。当前元素的索引
arr可选。当前元素所属的数组对象。
initialValue可选。传递给函数的初始值

示例：
我们对numbers数组中所有元素求和：

1
2
const sum = numbers.reduce((previous,current) => previous + current)
console.log(sum) // 55

for…of循环迭代

ES2015（ES6）引入了迭代数组值的for…for循环。与for…in循环的差别就是前者迭代数组的值，后者迭代数组的索引
用法为：

1
2
3
for(let n of numbers){
    console.log(n % 2 === 0 ? '偶数' : '奇数');
}

使用@@iterator 对象迭代

ES2015（ES6）为Array类增加了一个@@iteratior属性，需要通过Symbol.iterator来访问。

1
2
3
4
5
6
let iterator = numbers[Symbol.iterator]();
console.log(iterator.next().value); // 1
console.log(iterator.next().value); // 2
console.log(iterator.next().value); // 3
console.log(iterator.next().value); // 4

通过迭代器的next()方法，就能依次得到数组中的值。如果想遍历数组的每个元素，假设数组长度为10，就要不断iterator.next() 10次。当然可以用循环直接遍历迭代器来：

1
2
3
4
let iterator = numbers[Symbol.iterator]();
for (let n of iterator){
    console.log(n);
}