手撕一个promise.all（promise.all的实现原理）

首先康康定义：

Promise.all()方法用于将多个 Promise 实例，包装成一个新的 Promise 实例。

抄袭至阮一峰大佬的ES6权威指南。
看不懂没关系，直接打个栗子。

function promise_1(){
    return new Promise((resolve,reject) => {
        setTimeout(() => resolve(1),1000)
    })
}

function promise_2(){
    return new Promise((resolve,reject) => {
        setTimeout(() => resolve(2),1000)
    })
}

function promise_3(){
    return new Promise((resolve,reject) => {
        setTimeout(() => resolve(3),1000)
    })
}

promise_1().then((res) => {
    console.log(res);
    return promise_2()
}).then((res) => {
    console.log(res)
    return promise_3()
}).then((res) => {
    console.log(res)
})

很简单的3个promise的依次执行。输出结果如下图所示

略显臃肿了，而且之后的promise并不需要使用到之前promise返回的数据。可以直接用promise.all来实现。
 

function promise_1(){
    return new Promise((resolve,reject) => {
        setTimeout(() => resolve(1),1000)
    })
}

function promise_2(){
    return new Promise((resolve,reject) => {
        setTimeout(() => resolve(2),1000)
    })
}

function promise_3(){
    return new Promise((resolve,reject) => {
        setTimeout(() => resolve(3),1000)
    })
}

Promise.all([promise_1(),promise_2(),promise_2()]).then((res)=>{console.log(res)})

输出结果如下

可以直接看出，Promise.all以promise对象数组为参数，返回值是promise对象们resolve返回的值。
知道原理之后直接动手即可。这里我个人认为不要直接看网上的别人的实现。自己想怎么写就怎么写。能自己实现的就是好猫。实在写不出的那就是没有理解promise.all的工作原理。那么此时可以再看看上面的栗子。
还是写不出才可以参考别人的实现噢！
 

---

假装自己是一个分割线！！！

首先，promise.all的入参是一个数组，promise.all返回值是一个promise。毫无疑问。直接打个框架

function diyPromiseAll(arr){
    return new Promise((resolve,reject) => {
        
    })
}

再搞个数组来保存全部promise的返回值。
​​​

function diyPromiseAll(arr){
    let res_arr = []
    return new Promise((resolve,reject) => {
        
    })
}

唰！

function diyPromiseAll(arr) {
  // 这个是保存返回值的数组
  let res_arr = [];
  // 这个是当前遍历到的promise的下标
  let currentPromiseIndx = 0;
  return new Promise((resolve, reject) => {
    // 这里差不多是个递归函数，如果没有遍历到最后一个promise，那么将一直递归到最后一个为止
    function dealPromise() {
      if (currentPromiseIndx === arr.length - 1) {
        arr[currentPromiseIndx].then(
          res => {
            res_arr.push(res);
            resolve(res_arr);
          },
          err => {
            reject(err);
          }
        );
      } else {
        arr[currentPromiseIndx].then(
          res => {
            res_arr.push(res);
            currentPromiseIndx++;
            dealPromise();
          },
          err => {
            reject(err);
          }
        );
      }
    }
    dealPromise();
  });
}