在现代前端开发中,我们经常需要处理多个异步请求的结果,并将它们合并作为一个返回值使用。在 ES10 中,可以通过 Promise.allSettled()
方法来处理这种情况。
Promise.allSettled()
Promise.allSettled()
方法接收一个 Promise 数组作为参数,并返回一个 Promise 对象。该 Promise 对象在所有传入的 Promise 对象都已经 settled(包括 resolved 和 rejected)之后才会 settled。
该方法不会抛出异常。如果传入的 Promise 数组中存在 rejected 的 Promise 对象,它们的结果会被包装在一个对象中返回,而不会抛出异常中断代码执行。
Promise.allSettled()
的返回值是一个 Promise,其中包含传入的 Promise 数组中所有 Promise 对象的 settled 状态和结果。每个 settled Promise 的结果都包含在一个对象中,并带有一个表明其状态的属性(status
)。
示例代码如下:
const promise1 = Promise.resolve('Success!'); const promise2 = Promise.reject('Error...'); Promise.allSettled([promise1, promise2]) .then(results => results.forEach(result => console.log(result.status))) // Output: // "fulfilled" // "rejected"
在上面的示例中,Promise.allSettled()
接收两个 Promise 对象:一个已经 resolved,一个已经 rejected。results
数组中包含两个对象,每个对象都有一个 status
属性来指示 Promise 对象的状态,以及一个 value
或 reason
属性,分别指示 resolved 和 rejected Promise 对象的结果。
处理结果
处理 Promise.allSettled()
返回的结果时,需要注意以下几点:
- 首先,需要检查每个 Promise 对象的状态,并根据其状态来处理结果。
- 其次,当所有 Promise 对象都已 settled 时,需要将所有 resolved Promise 对象的结果合并在一起使用。
- 最后,如果存在 rejected Promise 对象,需要根据具体情况进行处理。
以下是一个示例代码,展示了如何在 Promise.allSettled()
中处理多个异步请求并返回结果:
-- -------------------- ---- ------- ----- ---------- - ----- -- -- - ----- -------- - -------------------------------------------------------------- -- ------------ ----- -------- - -------------------------------------------------------------- -- ------------ ----- -------- - -------------------------------------------------------------- -- ------------ ----- ------- - ----- ----------------------------- --------- ----------- ----- ----- - ------- -------------- -- ------------- --- ------------ ----------- -- -------------- ----- ------ - ------- -------------- -- ------------- --- ----------- ----------- -- --------------- ------------------- -------------------- --
在上面的示例中,fetchUsers()
函数的目标是获取三个用户的数据,每个用户数据都是通过调用 fetch()
方法请求得到的。通过将三个 Promise
对象传递给 Promise.allSettled()
方法,我们可以同时处理多个异步请求。
在 Promise.allSettled()
返回结果后,我们对每个请求的结果进行了过滤和映射操作。我们使用 filter()
方法来过滤掉所有 rejected
的 Promise 对象,并使用 map()
方法将 resolved 的 Promise 对象的 value
属性提取出来。这样我们就能够将所有 resolved 的结果合并在一起,并将其放入 users
数组中。如果存在 rejected 的 Promise 对象,我们也使用 filter()
和 map()
方法将其提取到一个单独的 errors
数组中。
总结
通过使用 ES10 中的 Promise.allSettled()
方法,我们可以轻松地处理多个异步请求的结果,并将其合并为一个返回值。同时,我们还可以通过处理 resolved 和 rejected Promise 对象来确定如何处理结果,从而更好地控制程序的行为。
在下一次处理多个异步请求的结果时,不妨尝试使用 Promise.allSettled()
方法,它会使你的代码更加清晰易读,也会为你处理异步请求的结果带来更大的灵活性和可靠性。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/647ddc8d968c7c53b08ac4a7