面试官:来说一下 promise.all 和 promise.allSettled 的区别

前言

说到 Promise.all,很多人应该不陌生,那 Promise.allSettled,可能很多朋友并没有使用过,这两者有相同部分,也有不同部分,今天就带大家一起来了解一下这两个方法。

Promise.all()

Promise.all() 方法接受一个 Promise 对象的数组作为参数,并返回一个新的 Promise 实例。

该实例会在所有传入的 Promise 实例都完成后 才完成,而且传入的 Promise 实例中只要有一个被拒绝, 则该实例就会立即被拒绝

它的主要作用是将多个 Promise 实例组合成一个单一的 Promise 实例。

MDN官方解释:

Promise.all() - JavaScript | MDN (mozilla.org)

举例说明:

js 复制代码
const promise1 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('Promise 1 resolved'), 1000);
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(() => reject('Promise 2 rejected'), 500);
});

const promise3 = new Promise((resolve, reject) => {
  setTimeout(() => resolve('Promise 3 resolved'), 1500);
});

// 使用 Promise.all
Promise.all([promise1, promise2, promise3])
  .then(results => console.log(results))
  .catch(error => console.error(error));
// 输出: Promise 2 rejected

结果如下:

可以看到我们上面写了三个 Promise,promise1 /promise3为成功状态的promise,promise2为拒绝,所以打印结果为失败状态的 promise 。

如果三个都成功,则会输出一个数组,保存成功之后返回的信息。

Promise.allSettled()

Promise.allSettled() 方法也接受一个 Promise 对象的数组作为参数,并返回一个新的 Promise 实例。

该实例会在所有传入的 Promise 实例都完成(无论是 resolved 还是 rejected )后才完成

它会将每个传入的 Promise 实例的结果收集到一个数组中,数组中每一项是一个对象,对象的 status 表示对应 Promise 实例的状态,value 表示对应 Promise 实例的值,reason 仅当 status 为 "rejected",才存在,promsie 拒绝的原因。

可以看到和 Promise.all 不同的是,返回的是一个数组对象的格式,参数意义如下:

MDN官方解释:

Promise.allSettled() - JavaScript | MDN (mozilla.org)

举例说明:

js 复制代码
  const promise1 = new Promise((resolve, reject) => {
    setTimeout(() => resolve('Promise 1 resolved'), 1000)
  })

  const promise2 = new Promise((resolve, reject) => {
    setTimeout(() => reject('Promise 2 rejected'), 500)
  })

  const promise3 = new Promise((resolve, reject) => {
    setTimeout(() => resolve('Promise 3 resolved'), 1500)
  })

  // 使用 Promise.allSettled
  Promise.allSettled([promise1, promise2, promise3])
    .then((results) => console.log(results))
    .catch((error) => console.error(error))

同上,打印结果如下,可以看到被拒绝的 promise 打印出了 reason

区别

  1. Promise.all() 在其中任何一个 Promise 被拒绝时就会被拒绝,而 Promise.allSettled() 则会在所有 Promise 实例都完成(无论成功还是失败)时才完成。

  2. Promise.all() 返回的是一个数组,数组中的值是传入的 Promise 实例的结果值,而 Promise.allSettled() 返回的是一个数组,数组中的值是对象,每个对象表示对应的 Promise 实例的状态和结果值。

  3. 当你需要获取所有异步操作的结果时,无论是成功还是失败,应该使用 Promise.allSettled()。如果只关心所有操作都成功的情况,可以使用 Promise.all()。

相关推荐
脑袋大大的1 小时前
判断当前是否为钉钉环境
开发语言·前端·javascript·钉钉·企业应用开发
军军君011 小时前
基于Springboot+UniApp+Ai实现模拟面试小工具二:后端项目搭建
前端·javascript·spring boot·spring·微信小程序·前端框架·集成学习
quweiie2 小时前
tp8.0\jwt接口安全验证
前端·安全·jwt·thinkphp
xiaoyan20152 小时前
最新Flutter3.32+Dart3仿微信App聊天实例
前端·flutter·dart
汪敏wangmin2 小时前
Fiddler-抓包后直接生成Loadrunner脚本或者Jmeter脚本
前端·jmeter·fiddler
没有bug.的程序员3 小时前
JAVA面试宝典 -《安全攻防:从 SQL 注入到 JWT 鉴权》
java·安全·面试
彤银浦3 小时前
Web学习笔记3
前端·笔记·学习·html5
江城开朗的豌豆3 小时前
退出登录后头像还在?这个缓存问题坑过多少前端!
前端·javascript·vue.js
江城开朗的豌豆3 小时前
Vue的'读心术':它怎么知道数据偷偷变了?
前端·javascript·vue.js
江城开朗的豌豆3 小时前
手把手教你造一个自己的v-model:原来双向绑定这么简单!
前端·javascript·vue.js