
公众号:Code程序人生,分享前端所见所闻。
Promise.race() 是一个常见的 JavaScript Promise 方法,它接受一个 Promise 数组作为参数,并返回一个新的 Promise 对象。这个新的 Promise 对象在传入的 Promise 数组中,任意一个 Promise 对象状态变为 fulfilled 或者 rejected,它就会采用这个 Promise 对象的状态作为自己的状态,并返回它的结果或错误原因。
 本文将介绍如何手写实现一个简单的 Promise.race() 函数。
实现步骤
- 创建一个空的数组 results,它用来保存每个Promise对象的结果或错误原因。
- 遍历传入的 Promise数组,对于每个Promise对象,添加一个then()方法,将它的结果或错误原因保存到results数组中,并将其状态设置为fulfilled。
- 对于任意一个 Promise对象的状态变为fulfilled或者rejected,返回一个新的Promise对象,并采用这个Promise对象的状态作为自己的状态,并返回它的结果或错误原因。
下面是完整的实现代码:
Promise.race = function (promises) {
    return new Promise((resolve, reject) => {
        for (let i = 0; i < promises.length; i++) {
            Promise.resolve(promises[i]).then(resolve).catch(reject)
        }
    })
}
使用示例
我们可以通过以下示例来测试刚才实现的 race() 函数:
const promise1 = new Promise(resolve => setTimeout(() => resolve('foo'), 3000));
const promise2 = new Promise(resolve => setTimeout(() => resolve('bar'), 2000));
const promise3 = new Promise((resolve, reject) => setTimeout(() => reject('baz'), 1000));
promise.race([promise1, promise2, promise3])
  .then(result => console.log(result)) // 输出 "baz"
  .catch(error => console.error(error)); // 输出 "baz"
上面的示例中,我们创建了三个 Promise 对象,它们的状态分别为 pending,并分别在不同的时间内变为了 fulfilled 或者 rejected。然后我们传入这三个 Promise 对象到 race() 函数中,并通过 then() 和 catch() 方法来处理最终的结果或错误原因。由于 promise3 对象的状态最先变为了 rejected,因此最终的输出结果为 "baz"。
总结
Promise.race() 是一个非常实用的 Promise 方法,它可以让我们同时运行多个异步操作,并返回最先完成的操作的结果或错误原因。本文通过手写实现的方式,介绍了一个简单的 race() 函数的实现过程,并通过一个示例来演示它的使用。
![[架构之路-158]-《软考-系统分析师》-13-系统设计 - 高内聚低耦合详解、图解以及技术手段](https://img-blog.csdnimg.cn/img_convert/1b5eb161416b6c7a9e0917256b5f6f17.png)


















