在 ECMAScript 2021 中,Promise.any 成为了一个非常实用的新特性。它能够轻松地让开发者从多个 Promise 中只选择一个 resolve 或者 reject 状态。
Promise.any 的作用
在我们开发 Web 应用的时候,经常会面临以下情况:
- 同时发起多个请求,只需要其中一个请求返回结果即可。
- 多个请求中只有一个合法,其他的请求都是无效的。
在这些情况下,我们可以通过 Promise.all 来解决问题。Promise.all 接收一个 Promise 数组作为参数,返回该 Promise 数组中所有 Promise 对象 resolve 后的结果的数组。但是 Promise.all 同时要求所有 Promise 对象都 resolve 后才返回结果。如果其中一个 Promise 对象 rejected ,整个 Promise.all 就会失败。这显然不适用于上述场景。
在这种情况下,Promise.any 派上用场了。
Promise.any 接收一个 Promise 数组作为参数,并返回该 Promise 数组中最先 resolve 的 Promise 对象的 resolve 值。如果所有的 Promise 对象都 rejected,Promise.any 将返回一个 AggregateError 对象。
下面我们用一个例子对 Promise.any 进行详细的说明。
Promise.any 的示例
假设我们需要从一个 URL 列表中获取第一个有效的图片 URL。
Promise.all 示例
第一种解决方案是使用 Promise.all。使用 Promise.all 的话,代码大致如下:
-- -------------------- ---- ------- ----- ------------ - ------------ -- ---------- -------------- -- - -- ---------------- -- ---- - ------ ---- - ----- --- -------------- ------ -- --------- -- - ----- --- -------------- ------ -- -- ------------------------------------- -- - ----------------------- ---
从上面代码中我们可以看出,使用 Promise.all 需要对请求结果进行过滤和 catch 处理,以保证任何一个 Promise 请求失败都不会造成整个 Promise.all 请求的失败。这需要编写更多的代码,并且增加了代码复杂性。
Promise.any 示例
相对而言,Promise.any 的用法就更加简单了。
-- -------------------- ---- ------- ------------ ------------ -- ---------- -------------- -- - -- ---------------- -- ---- - ------ ---- - ----- --- -------------- ------ -- - ------------- -- - -------------------- ---
代码执行流程为:
- 将 URL 数组映射成 Promise 数组。
- 对于每个 URL,我们使用 fetch 请求,如果该请求得到了有效的响应,它将返回 URL;否则它将抛出一个错误。
- 使用 Promise.any 处理生成的 Promise 数组,并返回第一个 resolve 的值。
- 如果所有的 Promise 都返回 rejected 状态,Promise.any 返回一个 AggregateError 对象。
通过这个示例,我们可以看到使用 Promise.any 能够显著地简化代码,并且将源代码行数减少了一半,可读性也更好。
总结
Promise.any 是 ECMAScript 2021 中的一个非常实用的新特性。它可以让开发者轻松地从多个 Promise 中选择一个 resolve 或 reject 状态对应的结果,从而提高生产力和代码质量。在实际开发中,我们可以根据具体的业务场景使用 Promise.any 来简化代码,并提高代码的可读性和可维护性。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/647050d7968c7c53b0e719ca