在前端开发中，我们经常会使用 Promise.race 方法来处理异步操作。该方法会接收一个 Promise 数组，返回其中最先解决的 Promise 值。但是，如果多个 Promise 同时 resolve ，将会出现问题，因为它只会返回其中一个值。那么，在这种情况下，该如何避免 Promise.race 中多个 Promise 同时解决的问题呢？
使用 Promise.all
一种避免 Promise.race 中多个 Promise 同时解决的方法是使用 Promise.all。Promise.all 方法接收一个 Promise 数组，并且会等待所有 Promise 都解决后，再返回一个包含所有 Promise 值的数组。这个方法返回的 Promise 对象将在所有 Promise 都解决时被解决，并且使用数组来包含所有 Promise 的值。
示例代码：
-- -------------------- ---- -------
----- -------- - --- ----------------- ------- -- -
------------- -- -
---------------- - -----------
-- ------
---
----- -------- - --- ----------------- ------- -- -
------------- -- -
---------------- - -----------
-- -----
---
----- -------- - --- ----------------- ------- -- -
------------- -- -
---------------- - -----------
-- ------
---
---------------------- --------- ----------
-------------- -- -
--------------------
--
-------------- -- -
-------------------
---在这个例子中，Promise.all 将在所有 Promise 解决后返回一个所有 Promise 值的数组。
限制 Promise 调用
另一种避免 Promise.race 中多个 Promise 同时解决的方法是限制 Promise 调用。你可以通过 Promise.race 的参数来限制 Promise 调用，例如：
-- -------------------- ---- -------
----- -------- - --- ----------------- ------- -- -
------------- -- -
---------------- - -----------
-- ------
---
----- -------- - --- ----------------- ------- -- -
------------- -- -
---------------- - -----------
-- -----
---
----- -------- - --- ----------------- ------- -- -
------------- -- -
---------------- - -----------
-- ------
---
----------------------- ----------
------------- -- -
-------------------
---
------------------------
------------- -- -
-------------------
---在这个例子中，我们对 Promise.race 的调用进行了限制。我们首先将 promise1 与 promise2 传递给 Promise.race 方法，以确保只有一个 Promise 解决。我们还将 promise3 传递给 Promise.race 方法，以确保他只会解决其中一个 Promise。
总结
避免 Promise.race 中多个 Promise 同时解决的方法包括使用 Promise.all 和限制 Promise 调用。通过这些方法，我们可以更好地管理我们的异步操作，避免类似的冲突，从而更好地运用 Promise 的优势。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64e17333f6b2d6eab3c9d797