ES11 新特性:Promise.allSettled() 解决并发请求的问题

在前端开发中,我们经常会遇到需要同时发起多个请求的情景。因为 HTTP 协议是基于请求响应的,每个请求的结果都是独立的,所以当我们需要同时处理多个请求时,我们一般需要使用 Promise.all() 方法来将多个 Promise 对象组合在一起,并等待所有 Promise 都完成后再进行后续操作。但是这种方法存在一个缺点,即如果其中一个 Promise 失败了,整个 Promise.all() 都会失败,这可能会导致我们无法知道其它 Promise 的执行结果。

ES11 中引入了一个新的 Promise API,该 API 可以解决 Promise.all() 方法的上述问题,该方法就是 Promise.allSettled()。

Promise.allSettled() 方法

Promise.allSettled() 方法接受一个 Promise 数组作为参数,并返回一个 Promise 对象。当传入的所有 Promise 都完成后,该 Promise 对象才会完成。与 Promise.all() 方法不同的是,即使其中一个 Promise 失败了,Promise.allSettled() 方法也会继续执行,并返回一个由所有 Promise 状态构成的数组。

Promise.allSettled() 方法的语法如下:

----------------------------

其中 iterable 参数是一个可迭代对象,如 Array。

当 iterable 中的所有 Promise 对象都完成后,Promise.allSettled() 方法返回的 Promise 对象的状态有以下两种情况:

  • 如果所有 Promise 都是成功状态,Promise.allSettled() 方法返回 Promise 对象的状态为 fulfilled,其结果值为一个由所有 Promise 对象状态组成的数组。每个 Promise 对象状态由一个对象表示,对象有两个属性:status 和 value,其中 status 表示 Promise 对象状态,可以是 "fulfilled" 或 "rejected",value 表示 Promise 对象结果,当 status 为 "fulfilled" 时,value 表示 Promise 对象返回值,当 status 为 "rejected" 时,value 表示 Promise 对象抛出的错误原因。
  • 如果其中有一个或多个 Promise 是失败状态,Promise.allSettled() 方法返回 Promise 对象的状态为 fulfilled,其结果值为一个由所有 Promise 对象状态组成的数组。未失败的 Promise 对象状态为 "fulfilled",与 "rejected" 的 Promise 对象状态不同的是,它们的 value 属性值表示 Promise 对象返回值,而不是错误原因。已失败的 Promise 对象状态为 "rejected"。

Promise.allSettled() 示例

下面我们来看一个 Promise.allSettled() 的具体示例:

----- -------- - -
  -------------------
  ------------------ -------------- - ----------
  ------------------
--
----------------------------------------- -- -
  ---------------------- -- -------------------------- ---------------
---

输出为:

--------- -
-------- ------ ------- - ------
--------- -

在上面的示例中,我们创建了一个包含 3 个 Promise 对象的数组,第二个 Promise 对象被故意注入了一个错误,以展示 Promise.allSettled() 方法在处理失败 Promise 时的表现。结果可以看到,无论 Promise 是否成功,我们都可以使用返回的结果数组处理它们。因此,Promise.allSettled() 方法为我们带来了更加灵活和强大的并发请求处理方法。

结论

Promise.allSettled() 方法是 ES11 中引入的一个新的 Promise API,可以解决 Promise.all() 方法存在的一个缺陷,即如果其中一个 Promise 失败,整个 Promise.all() 都会失败,无法知道其它 Promise 的执行结果。Promise.allSettled() 方法会等待所有 Promise 对象完成,并返回一个由所有 Promise 对象状态组成的数组,值得注意的是,即使其中有失败的 Promise 对象,Promise.allSettled() 方法也不会因此而失败。使用 Promise.allSettled() 方法可以让我们更加灵活和强大地处理并发请求。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/67316b100bc820c58238bcf7