数组的遍历方法有哪些

---

一、forEach()

不改变原数组，没有返回值，会返回新数组
功能：用于调用数组的每个元素，并将元素传递给回调函数。
数组中的每个值都会调用回调函数，回调函数有三个参数：

• currentValue： 必需。当前元素

• index： 可选。当前元素的索引值。

• arr： 可选。当前元素所属的数组对象

let arr = [1,2,3,4,5]
arr.forEach((item, index, arr) => {
  console.log(index+":"+item)
})

该方法还可以有第二个参数，用来绑定回调函数内部this变量（前提是回调函数不能是箭头函数，因为箭头函数没有this）：

let arr = [1,2,3,4,5]
let arr1 = [9,8,7,6,5]
arr.forEach(function(item, index, arr){
  console.log(this[index])  //  9 8 7 6 5
}, arr1)

需要注意的是，forEach方法对数组的操作会改变原数组，也没有返回值。

二、map()

不改变原数组，有返回值，会返回新数组
map() 方法会返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。该方法按照原始数组元素顺序依次处理元素。
注意： map() 不会对空数组进行检测，它会返回一个新数组，不会改变原始数组。
该方法的第一个参数为回调函数，他有三个参数：
currentValue： 必须。当前元素的值
index ：可选。当前元素的索引值
arr ：可选。当前元素属于的数组对象

let arr = [1, 2, 3];
arr.map(item => {    return item+1;})// 返回值： [2, 3, 4]

第二个参数用来绑定参数函数内部的this变量，可选：

var arr = ['a', 'b', 'c'];//下面使用箭头函数会出错
[1, 2].map(function (e) {   
 return this[e];}, arr)// 返回值： ['b', 'c']

该方法可以进行链式调用：

let arr = [1, 2, 3];
 arr.map(item => item+1).map(item => item+1)// 返回值： [3, 4, 5]

三、filter()

有返回值，满足条件的元素会被返回，不改变原数组
filter()方法用于过滤数组，满足条件的元素会被返回。它的参数是一个回调函数，所有数组元素依次执行该函数，返回结果为true的元素会被返回。该方法会返回一个新的数组，不会改变原数组。

该方法的第一个参数是回调函数，它有三个参数：

currentValue： 必须。当前元素的值
index ：可选。当前元素的索引值
arr ：可选。当前元素属于的数组对象

let arr = [1, 2, 3, 4, 5]
//格式中加括号，同时加return也行
arr.filter(item => item > 2)

// 结果：[3, 4, 5]

同样，他也有第二个参数，用来绑定参数函数内部的this变量。
第三、ECMAScirpt5 中 Array 类中的 filter 方法使用目的是移除所有的 ”false“ 类型元素 (false, null, undefined, 0, NaN or an empty string)：

var a=[1,2,"b",0,{},"",NaN,3,undefined,null,5];
//Boolean是一个回调函数
var b=a.filter(Boolean); // [1,2,"b",{},3,5]

四、every()

有返回值，不改变原数组
功能：如果每个元素都符合条件返回true,否则返回false
同filter()，也有三个参数，item,index,数组名

let arr = [1, 2, 3, 4, 5]
arr.every(item => item > 0)

// 结果： true

五、some()

有返回值，不改变原数组
功能：如果有一个元素符合条件 ，返回true
同filter()，也有三个参数，item,index,数组名

let arr = [1, 2, 3, 4, 5]
arr.some(item => item > 4)

// 结果： true

六、find()

有返回值，不改变原数组
功能：返回符合条件的第一个元素

• 当数组中的元素在测试条件时返回 true 时， find() 返回符合条件的元素，之后的值不会再调用执行函数。
• 如果没有符合条件的元素返回 undefined

注意: find() 对于空数组，函数是不会执行的。
该方法的第一个参数也是一个函数，它有三个参数：

• currentValue ：必需。当前元素
• index ：可选。当前元素的索引
• arr ：可选。当前元素所属的数组对象

let arr = [1, 2, 3, 4, 5]
arr.find(item => item > 2)

// 结果： 3

七、findIndex()

功能：返回第一个符合条件的元素下标

• 当数组中的元素在函数条件时返回 true 时， findIndex() 返回符合条件的元素的索引位置，之后的值不会再调用执行函数。
• 如果没有符合条件的元素返回 -1

注意: findIndex() 对于空数组，函数是不会执行的。
该方法的第一个参数也是一个函数，它有三个参数：

• currentValue ：必需。当前元素
• index ：可选。当前元素的索引
• arr ：可选。当前元素所属的数组对象

let arr = [1, 2, 3, 4, 5]
arr.findIndex(item => item > 2)

// 结果： 2

八、reduce()

加初始值，可改变原数组，有返回值，返回值是数组的和
功能：按数组下标升序对数组元素求和
语法： arr.reduce(callback,[initialValue])

reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，接受四个参数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引，调用 reduce 的数组。

(1) callback （执行数组中每个值的函数，包含四个参数）

• previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue））

• currentValue （数组中当前被处理的元素）

• index （当前元素在数组中的索引）

• array （调用 reduce 的数组）

(2) initialValue （作为第一次调用 callback 的第一个参数。）

var arr = [1, 2, 3, 4]
var sum = arr.reduce((prev, cur, index, arr) => {
    console.log(prev, cur, index);
    return prev + cur;
})
console.log(arr, sum);

输出结果：

再来加一个初始值看看：

var arr = [1, 2, 3, 4]
var sum = arr.reduce((prev, cur, index, arr) => {
    console.log(prev, cur, index);
    return prev + cur;
}, 5)
console.log(arr, sum);

输出结果：

通过上面的两个例子，我们可以得出结论：如果没有提供initialValue，reduce 会从索引1的地方开始执行 callback 方法，跳过第一个索引。如果提供initialValue，从索引0开始

注意，该方法如果添加初始值，就会改变原数组，将这个初始值放在数组的最后一位。

九、reduceRight()

功能：对数组逆序（按数组下标）求和
其它同reduce()

var arr = [1, 2, 3, 4]
var sum = arr.reduceRight((prev, cur, index, arr) => {
    console.log(prev, cur, index);
    return prev + cur;
}, 5)
console.log(arr, sum);

执行结果：