compose

compose是redux使用的一个方法.

该方法可以将多个中间件方法糅合成一个方法.

试想以下问题 : 存在[a,b,c]这样一个数组,如何将数组里的方法变成一个方法.并倒序执行

let middlewares = [
  a=> { 
    console.log('a执行了')
    return a + 1 
  },
  b => { 
    console.log('b执行了')
    return b + 2 
  },
  c => { 
    console.log('c执行了')
    return c + 3 
  }
]

方法1. 通过闭包返回一个函数,并依次遍历中间件,并保存结果

function compose(...middlewares) { 
  let funcs = middlewares
  return (...args)=>{ 
    let index = funcs.length-1,
    result = funcs[index-1](...args)
    while(--index>=0) { 
      result = funcs[index](result)
    }
  }
}
compose(...middlewares)(1)
/**
 * c执行了
 * b执行了
 * a执行了
 * 7
 */

方法2. redux做法

function compose(...funcs) {
  if (funcs.length === 0) {
    return arg => arg
  }

  if (funcs.length === 1) {
    return funcs[0]
  }
  return funcs.reduce((a, b) => (...args) => a(b(...args)))
}

当入参个数为0时,返回一个thunk函数

当入参个数为1时,直接返回

两个以上调用reduce方法

funcs.reduce((a,b)=>{ 
  return (...args)=> { 
    return a(b(...args))
  }
})

// 生成以下函数
let first = (...args)=> { 
  return a(b(...args))
}

let second = (...args)=> { 
  return first(c(...args))
}

// 相当于
(...args)=> { 
  return a(b(c(...args)))
}

所以中间件的调用顺序是倒序的