前言
在 Web 开发中，异步操作是必不可少的。为了解决异步操作的问题，Promise 出现了。Promise 是一种解决异步编程的方法，它可以将异步操作转化为同步操作。在 ECMAScript 2021 中，新加入了一个方法 Promises.any()，它可以解决 Promise.all() 方法在某个 Promise 被拒绝时的问题。
Promises.any() 的实现
Promises.any() 方法接收一个 Promise 数组作为参数，返回一个新的 Promise。当 Promise 数组中的任意一个 Promise 被解决时，返回的 Promise 就会被解决，返回被解决的 Promise 的值。如果 Promise 数组中的所有 Promise 都被拒绝了，返回的 Promise 就会被拒绝，并返回一个 AggregateError 对象，其中包含所有 Promise 的拒绝原因。
下面是 Promises.any() 方法的示例代码：
----- -------- - - ------------------- ------------------ ---------------- ------------------ -- --------------------- ------------- -- ------------------- -------------- -- --------------------
上面的代码中，Promise 数组中的第二个 Promise 被拒绝了。但是由于 Promises.any() 方法的存在，代码仍然会输出 1，因为 Promises.any() 方法会返回第一个被解决的 Promise 的值。
Promises.any() 的实用场景
Promises.any() 方法可以在以下情况下使用：
1. 并发请求
在 Web 开发中，经常需要向服务器发起多个请求，然后等待所有请求都返回结果后再做处理。使用 Promise.all() 方法可以实现这个功能。但是如果其中一个请求失败了，就会导致 Promise.all() 方法返回一个拒绝状态的 Promise。如果我们只关心其中一个请求的结果，而不关心其他请求的结果，那么 Promises.any() 方法就可以派上用场了。
下面是一个并发请求的示例代码：
----- ---- - - --------------------------------------- ----------------------------------------------- -------------------------------------- -- ----- -------- - ------------ -- ------------ --------------------- ---------------- -- ---------------- ------------ -- ------------------ -------------- -- --------------------
上面的代码中，我们向三个 URL 发起了请求，使用 Promises.any() 方法来获取第一个请求的结果。如果第一个请求返回了有效数据，我们就可以对它进行处理。如果第一个请求失败了，我们可以选择继续等待其他请求的结果，或者直接处理错误。
2. 优化图片加载
在 Web 开发中，图片加载是一个很常见的问题。如果我们需要在页面中加载多张图片，我们可以使用 Promise.all() 方法来等待所有图片加载完成后再显示页面。但是如果其中一张图片加载失败了，就会导致 Promise.all() 方法返回一个拒绝状态的 Promise。这样就会导致页面无法正常显示。
如果我们只需要其中一张图片加载成功即可，那么 Promises.any() 方法就可以派上用场了。下面是一个优化图片加载的示例代码：
----- ---- - -
---------------------------------
---------------------------------
--------------------------------
--
----- --------- - ----- -- -
------ --- ----------------- ------- -- -
----- --- - --- --------
---------- - -- -- -------------
----------- - -- -- ------------
------- - ----
---
--
----- -------- - --------------------
---------------------
----------- -- ------------------ ------ -- ----------
------------ -- ------------------ ------ -- ------ -- ---------上面的代码中，我们向三个 URL 发起了图片加载请求，使用 Promises.any() 方法来获取第一个加载成功的图片 URL。如果第一个图片加载成功了，我们就可以对它进行处理。如果第一个图片加载失败了，我们可以选择继续等待其他图片加载完成，或者直接处理错误。
总结
Promises.any() 方法是 ECMAScript 2021 中的一个新方法，它可以解决 Promise.all() 方法在某个 Promise 被拒绝时的问题。Promises.any() 方法可以在并发请求和优化图片加载等场景中派上用场。使用 Promises.any() 方法可以让我们更好地处理异步操作，提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/66155851d10417a22257f59f