随着前端对于异步操作的大量使用,我们日常开发中常常需要处理多个异步操作,我们一般使用 Promise.all() 来实现并发执行和等待所有操作的结果。但是在并发操作中,一旦其中有一个 Promise 被 reject,就会导致整个 Promise.all() 被 reject,无法获取其它 Promise 的结果,极大的影响了程序的健壮性。这就是业内广泛讨论与关注的 Promise 处理并发模式下的异常问题。
ES2020 新增了 Promise.allSettled() 方法,用于处理并发模式下所有 Promise 的处理结果,包括 resolve 的情况和 reject 的情况。而 Promise.allReject() 是 Promise.allSettled() 的补充,专门用于处理 reject 的情况。它返回所有 Promise 的 reject 原因,并忽略 resolve 的情况。
Promise.allSettled() 方法
在介绍 Promise.allReject() 前,我们先简单聊一下 Promise.allSettled() 方法,了解其在 Promise 并发操作中的使用场景。
Promise.allSettled() 方法用于执行多个 Promise 实例(数组传入)中的所有 Promise,并在所有 Promise 结束后返回一个包含每个 Promise 执行结果的数组。它会等待所有 Promise 执行完成,不管 Promise 是 resolve 还是 reject,它都会将其结果封装成一个对象,对象中包含 Promise 本身和 Promise 结果(status 和 value)。
例如:
Promise.allSettled([
Promise.resolve('成功结果'),
Promise.reject(new Error('失败结果'))
]).then((res) => console.log(res));
// 输出结果 [{status: "fulfilled", value: "成功结果"}, {status: "rejected", reason: Error: 失败结果}]Promise.allReject() 方法
Promise.allReject() 方法是 ES2020 新增的 Promise 扩展方法,与 Promise.all() 方法类似,但是只会等待所有 Promise 被 reject 后返回所有 Promise 的 reject 原因。
例如:
Promise.allReject([
Promise.reject(new Error('第一个 Promise 失败原因')),
Promise.reject(new Error('第二个 Promise 失败原因'))
]).then((res) => console.log(res));
// 输出结果 [Error: 第一个 Promise 失败原因, Error: 第二个 Promise 失败原因]使用 Promise.allReject() 异步等待所有 Promise 是否 reject,做到了一旦出现 reject 就立即返回,不会等待所有 Promise 都处理完才返回,从而为我们的程序带来超高的健壮性和流畅性。
深度分析
Promise.allReject() 的原理其实就是在 Promise.all() 的基础上加了一个过滤的步骤,只返回 reject 的原因:
Promise.allReject = (promises) => {
return Promise.all(promises.map((p) => {
return p.catch((e) => e);
})).then((rejectReasons) => {
return rejectReasons.filter((e) => e instanceof Error);
});
};在使用时,将需要执行的 Promise 传入数组中,然后使用 Promise.allReject() 即可等待所有 Promise 是否 reject,并返回所有 reject 原因。
学习和指导意义
Promise.allReject() 提供了一个更为方便和简单的方式来处理并发模式下的异常,从而增强了程序的健壮性和流畅性。在开发过程中,我们应当多加关注和使用,以此保证程序代码的编写规范和程序运行的顺畅性。
当然,在使用 Promise.allReject() 时,我们也需要结合实际业务场景,慎重考虑并构思程序代码的逻辑结构,从而发挥 Promise.allReject() 的优点,避免由于异步异常处理不当而浪费程序资源和执行时间。
示例代码
Promise.allReject() 的使用与示例代码如下所示:
// www.javascriptcn.com code example
const p1 = new Promise((resolve, reject) => {
setTimeout(() => {
reject(new Error('p1 error'));
}, 1000);
});
const p2 = new Promise((resolve, reject) => {
setTimeout(() => {
reject(new Error('p2 error'));
}, 1500);
});
Promise.allReject([p1, p2]).then((res) => {
console.log(res);
// 输出结果 [Error: p1 error, Error: p2 error]
});在示例代码中我们模拟了多个 Promise 的执行过程,在所有 Promise 都 reject 后输出所有 reject 原因,可以看到 Promise.allReject() 方法非常简单易用,且在异步异常处理中起到了很好的效果。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/67d8080ba941bf7134e5705e