数组的各种遍历方式

先创建一个数组arr为例子

let arr=[1,2,3,2,4]

ES5中遍历方法

for

for(let i=0;i<arr.length;i++){
    if(arr[i]==2){
        break   //支持break，continue
    }
    console.log(arr[i])
}

输出结果是：1
当arr[i]为2的时候停止循环输出

forEach

arr.forEach(function(elem,index,array){
    if(arr[i]==2){
        continue  //报错，不支持break，continue
    }
    console.log(elem,index,array)
});

输出结果是：报错，原因是不支持break和continue语法
forEach后面的三个参数分别为当前正在遍历对象，索引，数组

map

let result=arr.map(function(value){
    value +=1
    return value
    // console.log(value);
})
console.log(arr,result)

输出结果是：[1, 2, 3, 2, 4]，[2, 3, 4, 3, 5]
map返回值会返回新数组，不会改变原数组元素

filter

let result=arr.filter(function(value){
    return value == 2
})
console.log(arr,result);

输出结果是：[1, 2, 3, 2, 4]，[2, 2]
filter返回值会返回符合条件筛选过滤后的新数组

some

let result=arr.some(function(value){
    // console.log(value);
    return value == 4
})
console.log(arr,result);

输出结果是：[1, 2, 3, 2, 4]，true
some是筛选数组中是否有符合条件的数，返回布尔型值，找到一个符合条件的就返回true，一个都找不到返回false

every

let result=arr.every(function(value){
    // console.log(value);
    return value == 2
})
console.log(arr,result);

输出结果是：[1, 2, 3, 2, 4]，false
every检测每个元素是否符合条件，返回布尔型值，每个都符合返回true，否则返回false，与some相反

reduce

可用于数组求和

let sum=arr.reduce(function(prev,cur,index,arr){
    return prev+cur
    // console.log(value);
},0)
console.log(arr,sum);

输出结果是：[1, 2, 3, 2, 4]，12
reduce接受一个函数作为累加器，第一个参数是方法，第二个参数是初始值，prev代表上一个值（从初始值开始），cur代表当前处理值，index索引，arr数组，返回一个新数组

可用于求数组中的最大值

let max=arr.reduce(function(prev,cur){
   return Math.max(prev,cur)
    // console.log(value);
},0)
console.log(arr,max);

输出结果是：[1, 2, 3, 2, 4]，4
使用Math.max方法

可用于求数组去重

let res=arr.reduce(function(prev,cur){
    prev.indexOf(cur) == -1 && prev.push(cur)
    return prev
 },[])
 console.log(arr,res);

输出结果是：[1, 2, 3, 2, 4]，[1, 2, 3, 4]
初始值为空数组,prev.indexOf(cur)当前数组是否包含正在处理的值，不包含则放入新数组中

for...in

Array.prototype.foo=function(){
    console.log('haha');
}
for(let index in arr){
    console.log(index,arr[index]);
}

输出结果是：
0 1
1 2
2 3
3 2
4 4
foo ƒ () {
console.log('haha');
}
PS：从输出结果可以看出，for...in在数组原型下自定义一个方法时也能遍历出来，因此不建议使用此方法来遍历数组

ES6中遍历方法

find

let res=arr.find(function(value){
    return value == 2
})
console.log(arr,res);

输出结果是：[1, 2, 3, 2, 4]，2
find是返回第一个通过测试的元素，没有找到元素返回undefined

findIndex

let res=arr.findIndex(function(value){
    return value == 2
})
console.log(arr,res);

输出结果是：[1, 2, 3, 2, 4]，1
find是返回第一个通过测试的元素的下标，第一个符合value等于2的下标是第二个元素，返回值为它的下标1

for...of

for(let item of arr){
    console.log(item);
}
for(let item of arr.values()){
    console.log(item);
}
for(let item of arr.keys()){
    console.log(item);
}
for(let [index,item] of arr.entries()){
    console.log(index,item);
}

第一和第二个输出结果是：1,2,3,2,4
第三个输出结果是0,1,2,3,4
第四个输出结果是下标+元素
for...of遍历的多种写法如上代码显示