【手撕代码系列】JS手写实现Promise.all

公众号: Code程序人生，分享前端所见所闻

Promise.all() 方法接收一个 Promise 对象数组作为参数，返回一个新的 Promise 对象。该 Promise 对象在所有的 Promise 对象都成功时才会成功，其中一个 Promise 对象失败时，则该 Promise 对象立即失败。
本篇博客将手写实现 Promise.all() 方法。

实现思路

实现 Promise.all() 方法的关键在于：

1. 在所有的 Promise 对象都成功时，返回一个包含所有 Promise 结果的数组。
2. 如果有一个 Promise 对象失败，则立即返回失败原因。

基于这个思路，我们可以通过以下步骤来手写实现 Promise.all() 方法：

1. 传入一个 Promise 对象数组。
2. 返回一个新的 Promise 对象。
3. 创建一个空数组，用于存储每个 Promise 对象的结果。
4. 遍历 Promise 对象数组，对于每个 Promise 对象，将它的结果添加到结果数组中。
5. 如果有一个 Promise 对象失败，则将返回的 Promise 对象立即拒绝，并返回失败原因。
6. 如果所有的 Promise 对象都成功，则返回包含所有结果的数组的 Promise 对象。

代码实现

Promise.all = function (promises) {
    let results = [];
    let length = promises.length;
    let promiseCount = 0;
    return new Promise((resolve, reject) => {
        for (let i = 0; i < promises.length; i++) {
            Promise.resolve(promises[i]).then(res => {
                results[i] = res;
                promiseCount++;

                if (promiseCount === length) {
                    resolve(results);
                }
            }, err => {
                reject(err);
            })
        }
    })
}

使用示例

以下是使用手写的 Promise.all() 方法的示例：

let promise1 = Promise.resolve(1);
let promise2 = Promise.resolve(2);
let promise3 = Promise.resolve(3);

promise.all([promise1, promise2, promise3])
  .then(results => {
    console.log(results); // [1, 2, 3]
  })
  .catch(reason => {
    console.log(reason);
  });

总结

在本篇博客中，我们手写实现了 Promise.all() 方法，实现了该方法的核心思想，并提供了使用示例。手写实现一些核心的 JavaScript 方法可以帮助我们更好地理解这些方法的原理和工作方式，同时也可以提高我们的编程技能和代码能力。