面试官:来说一下 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 小时前
笔试面试中关于链表相关的题目
数据结构·链表·面试·职场和发展
帮帮志1 小时前
面试前需要的准备,帮助提升面试通过
面试·职场和发展·跳槽·面试准备·简历准备
codergjw1 小时前
【P0】JVM面试篇
jvm·测试工具·面试
鱼锦0.02 小时前
在vue2中主页面怎么给子页面传递数据
前端·javascript·html
!win !5 小时前
前端跨标签页通信方案(下)
前端·javascript
f***45325 小时前
基于SpringBoot和PostGIS的各省与地级市空间距离分析
android·前端·后端
编码追梦人6 小时前
从 “手忙脚乱“ 到 “行云流水“:华为云 DevUI 与 MateChat 如何让前端开发飞起来
前端·华为云
用户47949283569156 小时前
TypeScript 简史:它是怎么拯救我的烂代码的
javascript·typescript
S***H2836 小时前
前端动画实现经验,性能优化与兼容性
前端
用户47949283569157 小时前
只有前端 Leader 才会告诉你:那些年踩过的模块加载失败的坑(二)
javascript