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

1,656 阅读2分钟

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

简介

Promise.allSettled 是在 ES2020 新增的方法

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

系列文章

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

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

回顾

首先我们来回顾下 Promise 的一些方法他们的对比,包括 Promise.allPromise.racePromise.any

首先先构造一些结果是 resolve 和 reject 的 Promise,做下面的测试用~

const promiseReject1 =  new Promise((resolve, reject) => setTimeout(reject, 500, 'promiseReject1'));
const promiseReject2 =  new Promise((resolve, reject) => setTimeout(reject, 1000, 'promiseReject2'));
const promiseReject3 =  new Promise((resolve, reject) => setTimeout(reject, 1500, 'promiseReject3'));

const promiseResolve1 =  new Promise((resolve, reject) => setTimeout(resolve, 500, 'promiseResolve1'));
const promiseResolve2 =  new Promise((resolve, reject) => setTimeout(resolve, 1000, 'promiseResolve2'));
const promiseResolve3 =  new Promise((resolve, reject) => setTimeout(resolve, 1500, 'promiseResolve3'));

分别构造了 resolve 和 reject 的 Promise 各三个,分别通过 setTimeout 在不同的时间后改变 Promise 的状态。接下来我们分别测试 Promise.allPromise.racePromise.any 在不同情况下的表现:

Promise.all

Promise.all([
  promiseReject1, promiseReject1, promiseResolve2
])
.then(value => console.log(`Result Promise.all: ${value}`))
.catch (err => console.log('Result Promise.all err', err))
// Result Promise.all err" "promiseReject1

首先,Promise.all 会返回一个 Promise 实例,它在所有输入的 promise 的 resolve 回调都结束,或者输入的 iterable 里没有 promise 了的时候,会去执行 resolve 回调,结果是多个 promise resolve 的结果(这里比较常用没有给例子)

上面例子中表示,只要任何一个输入的 promise 的 reject 回调执行或者输入不合法的 promise 就会立即抛出错误。

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

Promise.race

Promise.race([
  promiseReject3, promiseResolve1, promiseResolve2
])
.then(value => console.log(`Result Promise.race: ${value}`))
.catch (err => console.log(`Result Promise.race err: ${err}`))
// Result Promise.race: promiseResolve1

Promise.race 方法返回一个 promise,一旦迭代器中的某个 promise 解决或拒绝,返回的 promise 就会解决或拒绝。多个 promise 是一个竞速的过程

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

Promise.any

Promise.any([
  promiseReject1, promiseResolve1, promiseResolve2
])
.then(value => console.log(`Result Promise.any Resolve: ${value}`))
.catch (err => console.log(err))
// Result Promise.any Resolve: promiseResolve1
Promise.any([
  promiseReject1, promiseReject2, promiseReject3
])
.then(value => console.log(`Result Promise.any Reject: ${value}`))
.catch (err => console.log('Result Promise.any Reject err', err)) // AggregateError 聚合错误
// Result Promise.any Reject err: [object Error]

Promise.any 是 ES2021 的新特性之一,它只要其中的一个 promise 成功,就返回那个已经成功的 promise 。如果可迭代对象中没有一个 promise 成功(即所有的 promises 都失败/拒绝),就返回一个失败的 promise AggregateError类型的实例

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

对比

Promise.any 本质上和 Promise.all 是相反的

对于 resolve,Promise.all所有 promise 都 resolve 后,返回的 Promise 的实例 resolve;Promise.any 是有任意一个 resolve 后,返回的 Promise 的实例 resolve。

对于 reject,Promise.all任意一个 promise 都 reject 后,返回的 Promise 的实例 reject;Promise.any所有 promise 都 reject 后,返回的 Promise 的实例 reject;

以上是本文全部内容,下一篇将介绍 Promise.allSettled,欢迎点赞和评论~