数组reduce的给力用法

44 阅读1分钟

语法

    arr.reduce(callback, [initialValue])

callback

执行数组中每个值的函数, 包含四个参数

  1. previousValue: 上一次调用的返回值, 或者初始值
  2. currentValue: 数组中当前数据
  3. index: 数组中当前索引
  4. array: 调用reduce的数组

initialValue

作为第一次调用callback的第一个参数

如果没有提供initialValue, reduce会从索引为1的地方开始执行callback方法, 调过0索引, 如果提供了initialValue, 就从索引为0开始执行。

数组为空

不提供initialValue会报错

    var arr = []; 
    var sum = arr.reduce(function(prev, cur, index, arr) { 
            console.log(prev, cur, index); 
            return prev + cur; 
        }) 
        
    //报错,"TypeError: Reduce of empty array with no initial value"
    var arr = []; 
    var sum = arr.reduce(function(prev, cur, index, arr) { 
        console.log(prev, cur, index); return prev + cur; 
     },0) 
     console.log(arr, sum); 
        
      // [] 0

简单用法

常用于数组求和, 求乘积。

    var  arr = [1, 2, 3, 4];
    var sum = arr.reduce((x,y)=>x+y)
    var mul = arr.reduce((x,y)=>x*y)
    console.log( sum ); //求和,10
    console.log( mul ); //求乘积,24

高级用法

计算每个元素出现的次数

    let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
    let nameNum = names.reduce((pre,cur)=>{
      if(cur in pre){
        pre[cur]++
      }else{
        pre[cur] = 1 
      }
      return pre
    },{})
    console.log(nameNum); 
    
    //{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}

数组去重

    let arr = [1,2,3,4,4,1]
    let newArr = arr.reduce((pre,cur)=>{
        if(!pre.includes(cur)){
          return pre.concat(cur)
        }else{
          return pre
        }
    },[])
    console.log(newArr);// [1, 2, 3, 4]

二维数组转换成一维

    let arr = [[0, 1], [2, 3], [4, 5]]
    let newArr = arr.reduce((pre,cur)=>{
        return pre.concat(cur)
    },[])
    console.log(newArr); // [0, 1, 2, 3, 4, 5]

多维数据转化为一维

    let arr = [[0, 1], [2, 3], [4,[5,6,7]]]
    const newArr = function(arr){
       return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[])
    }
    console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]

对象里的属性求和

    var result = [
        {
            subject: 'math',
            score: 10
        },
        {
            subject: 'chinese',
            score: 20
        },
        {
            subject: 'english',
            score: 30
        }
    ];

    var sum = result.reduce(function(prev, cur) {
        return cur.score + prev;
    }, 0);
    console.log(sum) //60