reduce使用Promise.resolve()构造连续Promise回调实现系列异步请求按顺序执行

reduce是es6中的遍历叠加方法，在某些时候和可以很方便的构造连续Promise回调，今天来看看咋玩的。

假设现在有很多需要get的接口，接口大概长这样：

let arr=[
    '***.com/a',
    '***.com/b',
    '***.com/c',
    .....
]

它们之间有依赖关系，必须第一个加载完去加载第二个，问如何实现这种加载的需求？

问题分析

上面的问题其实就是串行异步，就是把一系列的异步串起来，像糖葫芦一样，一个异步完了执行下一个。实现方法当然也很多，简单一点可以用async的await方法，和for一起使用：

async function go(){
    for(let i=0;i<arr.length;i++){
        await Axios.get(arr[i]);
    }
}

除了上面的方法，用reduce也是可以实现这种串行异步的：

arr.reduce((pre,next)=>{
    return prev.then(()=>Axios.get(next));
},Promise.resolve())

Promise.resolve是reduce的初始值，第一次遍历的prev.then就是Promise.resolve.then()；每次返回一个Axios.get(next)的Promise，然后下次遍历的时候，用这个Promise后面接个then，用async分开写的更清楚些:

arr.reduce(async (pre,next)=>{
    await prev;//等待上一个Promise
    return Axios.get(next);//返回一个新的Promise
},Promise.resolve())

最后相当于把整个Promise连起来了：

Promise.resolve().then(()=>new Promise()).then(()=>new Promise())....