ES6 —— 数组总结

1. map：映射   一个对一个

arr.map(function(item) { ... })    可以配合箭头函数：arr.map(item => ... ) 

 

        let arr1 = [1,2,3]
        let result1 = arr1.map(item=>item*2)
        console.log(result1)    // [2,4,6]

 

        let score = [56,88,90];
        let grade = score.map(item=>item>=60?'及格':'不及格');
        console.log(score);  // [56, 88, 90]
        console.log(grade);  // ["不及格", "及格", "及格"] 

可以看到一一对应的关系

 

 

2. reduce：汇总 一堆对一个

语法：arr.reduce(function(tmp, item, index [,arr]){ ... }[, initialValue])

tmp：初始值，或是上一次的叠加结果值，不指定initialValue时默认为arr[0]的值为起始值

item：当前值

index：当前值在数组中的index值

arr：当前数组，可不写

initialValue：指定初始执行的值

 

下面给几个例子用于熟悉这几个参数的含义

        let arr2 = [12,69,180,8763]
        arr2.reduce((tmp,item,index)=>{
            console.log(tmp,item,index)
        })
        // 12,69,1
　　　　 // undefined,180,2
　　　　 // undefined,8763,3  

        arr2.reduce((tmp,item,index)=>{
            console.log(tmp,item,index)
        },[])
        // [] 12 0
　　　　 // undefined,69,1
　　　　 // undefined,180,2
　　　　 // undefined,8763,3

　　　　 arr2.reduce((tmp,item,index)=>{
            console.log(tmp,item,index)
        },0)
　　　　 // 0 12 0
　　　　 // undefined,69,1
　　　　 // undefined,180,2
　　　　 // undefined,8763,3

 tmp是初始值或是上一次的叠加结果值，所以第一个我们可以看到tmp是有值的：

当有initialValue时显示为initialValue值，如果initialValue缺省则显示arr[0]的值，即12

后面剩下的循环这里undefined是因为reduce里面没有写两者相加这个语句，所以tmp这个值是没有的

 

在function里添加tmp+item，看下面这两个例子：

        arr2.reduce((tmp,item,index)=>{
            console.log(tmp,item,index)
            return tmp+item
        },[])
        // [] 12 0
　　　　 // 12,69,1
　　　 　// 1269,180,2
　　　　 // 1269180,8763,3

　　// 这里明显是字符串的拼接了，因为初始值是[]，所以tmp+item是按照字符串拼接的方式相加的


        let result2 = arr2.reduce((tmp,item,index)=>{
            console.log(tmp,item,index)
            return tmp+item
        }, 0)
        // 0 12 0
　　　　 // 12,69,1
　　　 　// 81,180,2
　　　 　// 261,8763,3

        console.log(result2)    // 9024   result2最后是最终求和的结果

 

 如果想求平均值呢？逻辑是：前面循环求和，最后一次求和后除以数组个数，即：

        let result3 = arr2.reduce((tmp,item,index)=>{
            if(index!=arr2.length-1){  // 不是最后一个
                return tmp+item
            }else {                    // 是最后一个
                return (tmp+item)/arr2.length
            }
        })
        console.log(result3)  // 2256 求平均值

3. filter 过滤  返回值是符合过滤条件的元素

arr.filter(function(){ ... })

        let arr3 = [22,5,63,34,12,7,69]
        let result4 = arr3.filter(item=>item%3==0)

        console.log(result4)   // [63, 12, 69]

filter在循环的过程中有一个判断过程，是true则返回，false则去掉

 

4. forEach  循环迭代

arr.forEach(function(item, index){ ... })