Promise.allSettled 解释和实践(二)- Promise.allSettled

1,490 阅读2分钟

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。

简介

Promise.allSettled 是在 ES2020 新增的方法

你可能会问,Promise 已经有好几个方法了?为什么还会增加呢?这个方法解决了什么问题,和其他方法的对比时什么样的呢?这个系列的文章帮你解答

上一篇文章介绍了 Promise.allPromise.racePromise.any 的对比回顾,简单总结一下,Promise.allPromise.any 的行为是相反的,Promise.all 在所有 promise 都 resolve 后,返回的实例 resolve,Promise.any 在任意一个 promise resolve 后,返回的实例 resolve。

Promise.race 是竞速的,有一个 promise,resolve 或者 reject,返回的 promise 就会 resolve 或 reject。

系列文章

Promise.allSettled 解释和实践(一)Promise.all、Promise.race、Promise.any 对比回顾

Promise.allSettled 解释和实践(二)- Promise.allSettled

Promise.allSettled

Promise.allSettled 在所有 promise 都 resolve 或者 reject 后,返回一个对象数组,其中每一项是每个 promise 的结果。

Promise.allSettled([
  promiseReject1, promiseResolve1, promiseResolve2
])
.then(value => console.log(value.forEach((result) => console.log(result.status))))
.catch (err => console.log(`Result Promise.allSettled err: ${err}`))

// "rejected"
// "fulfilled"
// "fulfilled"

Promise.allSettled 适用于传入 promise 结果不相互依赖(不需要每一个 promise 都成功,只是想要同时请求知道结果);不因为某一个 promise reject 就结束,的情况。

Promise.all 对比来看,Promise.all 适用于每一个 promise 都成功,或者在其中任何一个 reject 后,立即结束的情况。

举个例子

举个例子,假设我们要分别获取 一、二、三级分类 的列表数据,且它们的id不重复,根据我们使用数据的方式,有两种情况

  1. 一、二、三级分类,作为详情页分开字段的数据回显,不需要关心他们之间的关联关系,一个获取不到可以显示为空,这种情况用 Promise.allSettled

  2. 一、二、三级分类,作为编辑页的下拉框的级联选择项,这种情况需要三个列表都获取完毕,且没有 reject,这种情况用 Promise.all

参考

developer.mozilla.org/zh-CN/docs/…

以上为全部内容,欢迎点赞和评论交流~