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){ ... })