Promise.race() 是 Promise 对象提供的一个方法，它可以在多个 Promise 对象中选择一个最先解决的 Promise 对象，然后返回其解决或拒绝的值或原因。这个方法在前端开发中有着广泛的使用，在异步编程中可以更好地控制代码执行顺序，提高效率。本文将介绍 Promise.race() 的使用和注意事项。
Promise.race() 的使用
Promise.race() 方法接收一个 Promise 对象数组作为参数，然后返回一个新的 Promise 对象。这个方法返回的 Promise 对象将会被解决或拒绝，取决于数组中的 Promise 对象哪个首先完成。这里需要强调的是，一旦数组中的任何一个 Promise 对象完成，结果将不可逆转，即使后续的 Promise 对象有更好的结果。
下面是一个示例代码，展示了 Promise.race() 方法的使用：
-- -------------------- ---- ------- --- -------- - --- ----------------- ------- -- - ------------- -- ----------------- ------------ ------ --- --- -------- - --- ----------------- ------- -- - ------------- -- ----------------- ------------ ------ --- --- -------- - --- ----------------- ------- -- - ------------- -- ----------------- ------------ ------ --- ----------------------- --------- ---------- ------------ -- -------------------- -- -- --------- ---------- ------------ -- --------------------
在上面的代码中，Promise.race() 方法接收一个包含 3 个 Promise 对象的数组，然后返回一个新的 Promise 对象。在这个例子中，数组中的第一个 Promise 对象（promise1）首先完成，并返回“promise1 resolved!”的结果。因此，then() 方法打印出了这个结果。
Promise.race() 的注意事项
使用 Promise.race() 需要注意以下几点：
1. 参数必须为 Promise 对象数组
Promise.race() 方法接收的参数必须是一个包含 Promise 对象的数组，否则会抛出 TypeError 异常。
2. 结果不可逆转
一旦数组中的任何一个 Promise 对象完成，它的结果将不可逆转。即使后续的 Promise 对象有更好的结果，它也无法更改 Promise.race() 方法返回的 Promise 对象的状态。
3. 取消 Promise 不会终止 Promise.race()
如果 Promise.race() 方法返回的 Promise 对象接收到一个取消信号，比如调用 Promise 的 cancel() 方法，Promise.race() 方法本身也不会停止运行。这就需要在代码中自己处理。
4. Promise.race() 可能导致竞态条件
使用 Promise.race() 时要注意可能会导致竞态条件。竞态条件（Race Condition）指的是，当多个线程竞争同一个锁或资源时，导致一个线程依赖于另一个线程的结果。在 JavaScript 中，这也适用于对同一变量进行并发读写，比如在 Promise.race() 中使用同一个全局变量。
下面是一个展示 Promise.race() 导致竞态条件的例子：
-- -------------------- ---- -------
--- -------
--- -------- - --- ----------------- ------- -- -
------------- -- -
------ - --------- -----------
----------------
-- ------
---
--- -------- - --- ----------------- ------- -- -
------------- -- -
------ - --------- -----------
----------------
-- ------
---
----------------------- ----------
-------- -- -------------------- -- -- --------- ---------- - --------- ----------
------------ -- --------------------在上面的代码中，当 Promise1 完成时，它将 result 设置为“promise1 resolved!”并解决 Promise 对象。但是，由于 Promise.race() 方法返回的 Promise 对象依赖 result，因此它可能会在 Promise2 完成后才输出。这可能会导致一个竞态条件，因为 Promise.race() 不能保证哪个 Promise 对象首先完成。
结论
Promise.race() 方法是前端开发中非常有用的方法，可以提高代码的效率和控制代码执行顺序。但是，在使用 Promise.race() 时，需要注意其细节，避免导致竞态条件等问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6773e9ba6d66e0f9aae8d66c