Promise.all手動實現

前言

假設一下Promise其他所有函數都正常工作，但Promise.all功能失效了，我們現在就要爲程序重寫一個Promise.all。

Promise.all正常使用

下面爲Promise.all的功能展示。正常情況下我們應該輸出數組對象[1, 2, 3]。

let promise1 = new Promise(function(resolve) {
  resolve(1);
});
let promise2 = new Promise(function(resolve) {
  resolve(2);
});
let promise3 = new Promise(function(resolve) {
  resolve(3);
});

let promiseAll = Promise.all([promise1, promise2, promise3]);
promiseAll.then(function(res) {
  console.log(res);
});

ok，我們的Promise.all只要實現上面的功能就可以了。

Promise.all = function(promises) {
  let results = [];
  return new Promise(function(resolve) {
      promises.forEach(function(val) {
      // 按順序執行每一個Promise操作
      val.then(function(res) {
        results.push(res);
      });
    });
    resolve(results);
  });
}

上面是最簡化的版本，但是也有兩個問題。一、Promise.all傳遞的參數可能不是Promise類型，可能不存在then方法。二、如果中間發生錯誤，應該直接返回錯誤，不執行後面操作。

改造版本

Promise.prototype.all = function(promises) {
  let results = new Array(promises.length);
  let promiseCount = 0;
  let promisesLength = promises.length;
  return new Promise(function(resolve, reject) {
    for (let val of promises) {
      Promise.resolve(val).then(function(res) {
        promiseCount++;
        // results.push(res);
        results[promiseCount] = res;
        // 當所有函數都正確執行了，resolve輸出所有返回結果。
        if (promiseCount === promisesLength) {
          return resolve(results);
        }
      }, function(err) {
        return reject(err);
      });
    }
  });
};

總結

Promise.all實現不難，只要瞭解它做了哪些事情，並且瞭解Promise的機制，就能大概猜出內部實現。