写的原因： 每一种遍历方式都有其特性，不同的逻辑处理上用上不同的遍历可以少敲几次键盘。每当我要写适当的遍历时总是会忘记，所以写下这篇供之后查看。也加深自己的印象。

for

for循环是最基本的遍历方式，分为倒叙和正序。不做代码演示。

forEach

用于遍历数组

语法

arr.forEach(callback(currentValue [, index [, array]])[, thisArg])

参数

• callback: 回调函数，接收三个参数
  currentValue: 当前的值
  index(可选): 当前的索引
  array(可选): 当前操作的数组
• thisArg(可选): 回调函数的this指向

示例

const obj = {
    name: 'chris',
    level: 'rookie'
}
const arr = ['a', 'b', 'c'];

arr.forEach(function(val, key, arr){
    console.log(val, key, arr, this.level);
}, obj);

/*
	依次输出
	a 0 (3) ["a", "b", "c"] rookie
	b 1 (3) ["a", "b", "c"] rookie
	c 2 (3) ["a", "b", "c"] rookie
*/

for…in

主要用于遍历对象

语法

for( key in object ) { }

• key: 当前遍历的键
• object: 需要遍历的对象

示例

const obj = {
    name: 'chris',
    level: 'rookie'
}

for(key in obj){
    console.log(key);
}

/*
	依次输出
	name
	level
*/

for…of

遍历可迭代对象，包括 数组、字符串、map、set、arguments。

语法

for (const iterator of array) { … }

• iterator: 当前迭代的值
• array: 当前迭代的对象

const arr = [1, 2, 3];
for (const iterator of arr) {
    console.log(iterator); // 1 2 3
}

map

遍历数组并返回一个新的数组

语法

const newArr = arr.map(function callback(currentValue, index, array){ return currentValue * 2; }, thisArg);

参数

• callback: 回调函数，接收三个参数
  currentValue: 当前的值
  index(可选): 当前的索引
  array(可选): 当前操作的数组
• thisArg(可选): 回调函数的this指向

const arr = [1, 2, 3];
const newArr = arr.map(item => item * 2);
console.log(newArr); // [2, 4, 6]

filter

filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

语法

var newArray = arr.filter(callback(currentValue[, index[, array]])[, thisArg])

参数

• callback: 回调函数，接收三个参数
  currentValue: 当前的值
  index(可选): 当前的索引
  array(可选): 当前操作的数组
• thisArg(可选): 回调函数的this指向

const arr = [1, 2, 3, 4];
const newArr = arr.filter(currentValue => {
    return currentValue % 2 === 0;
});
console.log(newArr); // [2, 4]

every

检测一个数组内的所有元素是否都能通过某种测试，并返回布尔值。

语法

var bool = arr.every(callback(currentValue[, index[, array]])[, thisArg])

参数

• callback: 回调函数，接收三个参数
  currentValue: 当前的值
  index(可选): 当前的索引
  array(可选): 当前操作的数组
• thisArg(可选): 回调函数的this指向

const arr = [2, 4];

const bool = arr.every(currentValue => {
    return currentValue % 2 === 0;
});
console.log(bool); // true

some

测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。

语法

var bool = arr.some(callback(currentValue[, index[, array]])[, thisArg])

参数

• callback: 回调函数，接收三个参数
  currentValue: 当前的值
  index(可选): 当前的索引
  array(可选): 当前操作的数组
• thisArg(可选): 回调函数的this指向

const arr = [1, 2, 3, 4];

const bool = arr.some(currentValue => {
    return currentValue % 2 === 0;
});
console.log(bool); // true

reduce

方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值。

语法

arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

参数

• callback: 回调函数，接收四个参数
  accumulator：上一次迭代返回的值
  currentValue：当前值
  index(可选)：当前索引
  array(可选)：源数组
• initialValue(可选)：初始值，最先赋值给accumulator

const arr = [1, 2, 3, 4];

const count = arr.reduce((Accumulator, currentValue) => {
    return Accumulator + currentValue;
}, 5);
console.log(count); // 15

reduceRight

同reduce，但reduceRight是从数组右向左遍历，也就是从后向前。

原文链接:https://blog.csdn.net/weixin_45517927/article/details/117083419