深入解析Promise.allSettled()的使用方法

如何使用promise.allsettled()?下面本篇文章就来带大家了解一下promise.allsettled(),介绍一下它的使用方法,希望对大家有所帮助!

深入解析Promise.allSettled()的使用方法

Promise.allSettled() 方法返回一个在所有给定的 promise 都已经 fulfilledrejected 后的 promise,并带有一个对象数组,每个对象表示对应的 promise 结果。

接着,我们来看看 Promise.allSettled() 是如何工作的。

1. Promise.allSettled()

Promise.allSettled() 可用于并行执行独立的异步操作,并收集这些操作的结果。

该函数接受一个 promise 数组(通常是一个可迭代对象)作为参数:

const statusesPromise = Promise.allSettled(promises);

当所有的输入 promises 都被 fulfilledrejected 时,statusesPromise 会解析为一个具有它们状态的数组

{ status: 'fulfilled', value: value } — 如果对应的 promise 已经 fulfilled

或者 {status: 'rejected', reason: reason} 如果相应的 promise 已经被 rejected

1.png

在解析所有 promises 之后,可以使用 then 语法提取它们的状态:

statusesPromise.then(statuses => { statuses; // [{ status: '...', value: '...' }, ...]});

或者使用 async/await 语法:

const statuses = await statusesPromise;statuses; // [{ status: '...', value: '...' }, ...]

2. 取水果和蔬菜

在深入研究 Promise.allSettle() 之前,我们先定义两个简单的 helper 函数。

首先,resolveTimeout(value, delay)返回一个 promise ,该 promise 在经过 delay 时间后用 value 来实现

function resolveTimeout(value, delay) {  return new Promise(    resolve => setTimeout(() => resolve(value), delay)  );}

第二,rejectTimeout(reason, delay) – 返回一个 promise,在经过 delay 时间后拒绝reason

最后,我们使用这些辅助函数来试验 promise.allsettle()

2.1 All promises fulfilled

我们同时访问当地杂货店的蔬菜和水果。访问每个列表是一个异步操作:

const statusesPromise = Promise.allSettled([  resolveTimeout(['potatoes', 'tomatoes'], 1000),  resolveTimeout(['oranges', 'apples'], 1000)]);// wait...const statuses = await statusesPromise;// after 1 secondconsole.log(statuses); // [//   { status: 'fulfilled', value: ['potatoes', 'tomatoes'] },//   { status: 'fulfilled', value: ['oranges', 'apples'] }// ]

线上事例:https://codesandbox.io/s/all-resolved-yyc0l?file=/src/index.js

Promise.allSettled([...])返回一个 promise  statusesPromise,该 promise 在1秒内解决,就在蔬菜和水果被解决之后,并行地解决。

statusesPromise 解析为一个包含状态的数组。

数组的第一项包含有蔬菜的已完成状态:status: 'fulfilled', value: ['potatoes', 'tomatoes'] }

法语写作助手 法语写作助手

法语助手旗下的AI智能写作平台,支持语法、拼写自动纠错,一键改写、润色你的法语作文。

法语写作助手 31 查看详情 法语写作助手

同样的方式,第二项是水果的完成状态: { status: 'fulfilled', value: ['oranges', 'apples'] }

2.2一个 promise 被拒绝

想象一下,在杂货店里已经没有水果了。在这种情况下,我们拒绝水果的 promise。

promise.allsettle() 在这种情况下如何工作?

const statusesPromise = Promise.allSettled([  resolveTimeout(['potatoes', 'tomatoes'], 1000),  rejectTimeout(new Error('Out of fruits!'), 1000)]);// wait...const statuses = await statusesPromise;// after 1 secondconsole.log(statuses); // [//   { status: 'fulfilled', value: ['potatoes', 'tomatoes'] },//   { status: 'rejected', reason: Error('Out of fruits!') }// ]

线上事例:https://codesandbox.io/s/one-rejected-ij3uo?file=/src/index.js

Promise.allSettled([...]) 返回的 promise 在 1 秒后解析为一个状态数组:

数组的第一项,蔬菜 promise 成功解析:{ status: 'fulfilled', value: ['potatoes', 'tomatoes'] }

第二项,因为水果 promise  被拒绝,所以是一个拒绝状态: { status: 'rejected', reason: Error('Out of fruits') }

即使输入数组中的第二个 promise  被拒绝,statusesPromise仍然会成功解析一个状态数组。

2.3 所有的 promises 都被 rejected

如果杂货店里的蔬菜和水果都卖光了怎么办?在这种情况下,两个 promise 都会被拒绝。

const statusesPromise = Promise.allSettled([  rejectTimeout(new Error('Out of vegetables!'), 1000),  rejectTimeout(new Error('Out of fruits!'), 1000)]);// wait...const statuses = await statusesPromise;// after 1 secondconsole.log(statuses); // [//   { status: 'rejected', reason: Error('Out of vegetables!')  },//   { status: 'rejected', reason: Error('Out of fruits!') }// ]

线上事例:https://codesandbox.io/s/all-rejected-z4jee?file=/src/index.js

在这种情况下,statusesPromise仍然成功地解析为一个状态数组。然而,该数组包含被拒绝的promise 的状态。

3.总结

Promise.allSettled(promises)可以并行地运行 promise,并将状态(fulfilled 或reject)收集到一个聚合数组中。

Promise.allSettled(...)在你需要执行平行和独立的异步操作并收集所有结果时非常有效,即使某些异步操作可能失败。

英文原文地址:https://dmitripavlutin.com/promise-all-settled/

作者:Dmitri Pavlutin

更多编程相关知识,请访问:编程视频!!

以上就是深入解析Promise.allSettled()的使用方法的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/560068.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
P月亮可以 P长焦就不行 这一步厂商走错了
上一篇 2025年11月10日 00:38:57
Linux Compton配置指南:如何优化图形性能
下一篇 2025年11月10日 00:39:02

相关推荐

发表回复

登录后才能评论
关注微信