Promise#allSettled 只是目的地，道路千万条，error 抛去一条
在开发前端页面时，我们经常遇到需要同时请求多个 API 的情况，而 Promise#allSettled 就是一个解决方案。它可以将多个 Promise 同时执行，并返回一个包含所有 Promise 状态的数组。本文将详细介绍 Promise#allSettled 的使用方式以及优化方案。
一、Promise#allSettled 的使用方式
Promise#allSettled 接受一个 Promise 数组作为参数，然后返回一个 Promise 对象。该 Promise 对象在所有 Promise 都执行完成后才会被 resolved。在所有 Promise 中，如果有任意一个状态是 rejected，也不会导致该 Promise 被 rejected，它会正常执行，并将结果放入返回的数组中。下面是一个使用示例：
-- -------------------- ---- ------- ----- -------- - - -------------------- -------------------- ------------------- -- ---------------------------- ------------- -- - --------------------- -- ------------ -- - --------------------- ---展开代码
上面的示例中，我们使用 fetch 方法请求了三个不同的 API，然后将它们放入一个数组中，调用 Promise#allSettled 方法并传入该数组，最后使用 then 和 catch 方法处理返回值和错误信息。
二、Promise#allSettled 的优化方案
在实际开发中，我们可能会遇到一些错误情况，例如访问某些 API 时因为网络不稳定导致请求失败等。为了更好地处理这些错误情况，我们可以对 Promise#allSettled 进行一些优化。
- 使用 Promise#allSettled 和 Promise#race 方案
Promise#race 方法可以同时执行两个 Promise，然后返回一个 Promise 对象，该 Promise 对象将返回先执行完的 Promise 的状态。我们可以将 Promise#race 和 Promise#allSettled 结合使用。这样可以保证在某些 Promise 请求时间过长的情况下，我们仍然可以及时获取其他 Promise 的返回结果。
-- -------------------- ---- ------- ----- -------- - - -------------------- -------------------- ------------------- -- ----- ------------ - --- ----------------- ------- -- - ------------- -- ---------- ------------ ----------- ------ --- ------------------------------------------- -------------- ------------- -- - --------------------- -- ------------ -- - --------------------- ---展开代码
上面的示例中，我们设置一个 5 秒的超时时间，如果请求超时，则返回一个错误信息。如果请求未超时，则使用 Promise#allSettled 方法获取所有 Promise 的状态数组。
- 使用 async/await 方案
我们也可以使用 async/await 的方式处理 Promise#allSettled 返回的结果。这样代码会更加简洁易懂。
-- -------------------- ---- ------- ----- -------- ----------- - ----- -------- - - -------------------- -------------------- ------------------- -- ----- ------- - ----- ----------------------------- --- ---- ------ -- -------- - -- -------------- --- ------------ - -------------------------- - ---- - ----------------------------- - - - ------------展开代码
上面的示例中，我们使用 async/await 方式处理 Promise#allSettled 返回的结果，如果有结果是 fulfilled 状态，则输出返回结果，否则输出错误信息。
三、指导意义
在使用 Promise#allSettled 时，我们需要注意以下几点：
不要过度依赖 Promise#allSettled 方法，因为它只是把多个 Promise 请求放在了一起执行，并没有真正解决请求出错的问题，需要开发者进一步处理错误情况。
在使用 Promise#allSettled 时，我们应该使用多个优秀的软件工程规范，例如使用模块化编程方式、尽量避免使用全局变量、使用语义化的命名方式等，这样可以让代码更加健壮。
在使用活动数据 API 时，我们应该了解 API 的返回数据格式，以便更好地处理它们。通常情况下，我们应该检查返回的 JSON 数据是否有无效的属性，以避免出现意外问题。
总之，Promise#allSettled 是解决多个 Promise 同时执行的问题的一种较好方案，但我们使用它时需要注意它的优缺点，并在使用时结合实际需求进行相应的优化。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67baee95306f20b3a6a1ae5c
