ECMAScript 2020 (ES11) 中的 Promise.all 参数详解

阅读时长 4 分钟读完

在 ECMAScript 2020 (ES11) 中,Promise.all 方法新增了传入参数的功能,这一功能能够让开发者更加灵活地使用 Promise,本文将对 Promise.all 方法的参数进行详细讲解,并提供示例代码以帮助读者熟悉使用。

Promise.all 方法简介

Promise.all 方法接受一个 promise 对象数组作为参数,并返回一个新的 promise 对象。当数组中的所有 promise 对象状态全部变为已完成(resolved)时,新的 promise 对象的状态也变为已完成,并且它的值是一个包含数组参数中所有 promise 对象的结果值的数组。如果其中一个 promise 对象的状态变为拒绝(rejected),新的 promise 对象的状态也变为拒绝,并返回该被拒绝 promise 对象的 rejection 值。

例如:

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

以上代码创建了一个包含 3 个 Promise 的数组作为 Promise.all 方法的参数,并对这个 Promise 数组使用 then 方法来获得 Promise.all 方法返回的新 Promise 对象的结果值。

Promise.all 方法的参数

在 ECMAScript 2020 中,Promise.all 方法新增了第二个可选参数,用于设置参数处理逻辑。该可选参数为一个函数,参数列表与 Promise.all 方法接受的 Promise 数组一一对应。该函数的第一个参数对应数组中的第一个 Promise 对象的值,第二个参数对应数组中的第二个 Promise 对象的值,以此类推。传入此函数的参数会被处理成一个数组,返回值将成为 Promise.all 返回的 Promise 的最终结果。

例如:

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

以上代码传入了一个函数作为 Promise.all 方法的第二个参数,该函数接受一个数组参数,使用 reduce 方法将数组中的所有值进行求和,返回求和结果。在 Promise.all 方法的 then 回调中,获得了该函数的结果。

Promise.allSettled 方法

除了 Promise.all 方法,ECMAScript 2020 还新增了 Promise.allSettled 方法。Promise.allSettled 方法也接受一个 Promise 数组作为参数,并返回一个新的 Promise 对象。不同的是,新的 Promise 对象的状态只有两种:已完成(fulfilled)和已拒绝(rejected)。它会等待数组中的所有 Promise 对象都变为已完成或拒绝状态,然后返回一个数组,该数组的每个元素都是一个对象,对象包含两个属性:status 和 value(或 reason)。status 属性表示 Promise 对象的状态,value 或 reason 属性表示 Promise 对象的返回值或 rejection 值。

例如:

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

以上代码创建了一个含有 3 个 Promise 的数组,其中第二个 Promise 对象为拒绝状态。Promise.allSettled 方法将等待该数组中的所有 Promise 对象状态改变后,返回一个数组,包含 3 个对象,分别对应数组中的每一个 Promise 对象。其中第二个对象代表的是被拒绝的 Promise 对象,status 属性的值为 "rejected",reason 属性的值为 Error 对象。

总结

在 ECMAScript 2020 中,Promise.all 方法新增了第二个可选参数,可以接收一个处理函数,使开发者在处理一个包含多个不同类型信息的数组时更加灵活。Promise.all 方法的引入大大简化了多个异步操作之间的逻辑,而 Promise.allSettled 方法则能够帮助开发者更好地处理异步操作的结果。熟练掌握这两种方法能够使前端开发者在编写异步代码时变得更加得心应手。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/647851a6968c7c53b049004a

纠错
反馈