ES5 数组方法reduce()

ES5 数组方法reduce()

reduce()是es5版本中的一个数组方法,它的接收两个参数:
第一个参数是一个函数,成为累加器函数,目的是对数组中的每一项进行累计操作
第二个参数是一个初始值,作为累计函数的起始值,如果这个参数没有,则默认从数组中的第二项开始(currentIndex = 1), 对第一项和第二项进行累计
返回的是累加后的结果。
注意这个累加函数不是指加法,具体看例子:

  let a = [3,6,10,8,2];
  let b = a.reduce((prevItem,curItem,curIndex,arr) => {
    console.log(prevItem,curItem,curIndex,arr);
    return prevItem * curItem;
  });
  console.log("a,b", a, b);

用自己的方法重写reduce()

function myReduce (fn, initItem) {
    //console.log(this);
    let arr = this;
    let i = 0, 
        prevItem = null;
    if (typeof initItem !== "undefined") {
      i = 0;
      prevItem = initItem;
    } else {
      i = 1;
    }
    for (i; i < arr.length; i++) {
      if (prevItem === null && i === 1) {
        prevItem = arr[0]
      }
      if (typeof fn === "function") {
        prevItem = fn (prevItem, arr[i], i, arr);
      }
    }
    return prevItem;
  }
  Array.prototype.myReduce = myReduce;
  let c = a.myReduce((prevItem,curItem,curIndex,arr) => {
    console.log(prevItem,curItem,arr);
    return prevItem * curItem;
  });
console.log("a,c", a, c);

redux源码里面有个组合函数,就是用reduce()实现的

export default function compose(...funcs) {
    if (funcs.length === 0) {
        return arg => arg
    }
    
    if (funcs.length === 1) {
        return funcs[0]
    }
    // 这里注意,因为reduce没有传入第二个参数initValue
    // 此时a的初始值为第0项, b为第1项
    return funcs.reduce((a, b) => (...args) => a(b(...args)))
}
const fa = (x) => x + 1;
const fb = (x) => x + 2;
const fc = (x) => x + 3;
const fd = (x) => x + 4;

let x = 0;
console.log(fa(fb(fc(fd(x)))));

let fn = function () {
  //console.log(...arguments);
  return [fa,fb,fc,fd].reduce((prev,cur) => {
    console.log(prev,cur);
    return cur(prev)
  },...arguments);
}
console.log(fn(x))

使用myReduce()实现:

let mfn = function () {
  //console.log(...arguments);
  return [fa,fb,fc,fd].myReduce((prev,cur) => {
    //console.log(prev,cur);
    return cur(prev)
  },...arguments);
}
console.log('mfn:',mfn(0))

你可能感兴趣的:(ES5 数组方法reduce())