ES9 增加的 Promise.allSettled() 方法：解决 Promise.all() 的错误处理问题
在编写处理异步操作的前端代码时，Promise 成为了一个不可或缺的工具。其中 Promise.all() 方法可以用于将多个 Promise 同时执行，并且在所有 Promise 都成功返回结果时返回一个数组，但一旦其中一个 Promise 拒绝（reject），整个操作就会失败。这个问题在需要处理多个异步操作时会出现异常。ES9 增加了 Promise.allSettled() 方法，解决了这个问题。
Promise.all() 方法的错误处理问题
我们经常会在前端开发中使用 Promise.all() 方法来处理多个异步操作。例如：
// javascriptcn.com 代码示例
let promise1 = new Promise((resolve, reject) => { ... });
let promise2 = new Promise((resolve, reject) => { ... });
let promise3 = new Promise((resolve, reject) => { ... });
Promise.all([promise1, promise2, promise3])
.then(values => {
console.log(values);
})
.catch(error => {
console.error(error);
});在这个例子中，我们使用了 Promise.all() 方法将三个 Promise 进行了封装，然后等待它们返回结果。一旦所有结果都返回并且成功了，我们就可以处理返回结果(values)，否则它会捕捉到拒绝信息，并且触发 catch() 方法。
然而，这种错误处理方式不是很理想。使用 Promise.all() 方法时，它在任意一个 Promise 失败时就会拒绝（reject）。这意味着只有在所有 Promise 都成功时才会返回结果。即使有一个 Promise 失败，整个操作也会失败，这样无法得到任何正确的结果。这是一个问题，因为在某些情况下，我们需要对每个 Promise 的状态进行分析，即使有一个 Promise 失败，我们也需要知道它是什么。
Promise.allSettled() 方法：解决 Promise.all() 的错误处理问题
Promise.allSettled()方法可以解决Promise.all() 的错误处理问题。该方法会等待所有的 Promise 对象都变为 Settled 状态（即不是 pending 状态），并且返回一个数组。数组中的每个元素都是对象，分别代表每个 Promise 的状态。每个对象具有两个属性：status和value。
- 如果 Promise 对象处于fulfilled状态，status为‘fulfilled’，value为 Promise 对象的结果值。
- 如果 Promise 对象处于rejected状态，status为‘rejected’，value为 Promise 对象的错误信息。
例如：
let promise1 = Promise.resolve(1);
let promise2 = Promise.reject(2);
let promise3 = Promise.resolve(3);
Promise.allSettled([promise1, promise2, promise3])
.then(results => {
console.log(results);
});运行上面的代码，结果将如下：
[
{status: 'fulfilled', value: 1},
{status: 'rejected', value: 2},
{status: 'fulfilled', value: 3}
]上面的结果表示 promise1 在成功后返回了1， promise2 在失败后返回了2，promise3 在成功后返回了3。
使用 Promise.allSettled() 方法，我们可以轻松地捕捉所有 Promise 的结果，不管它们成功或失败。这使我们能够分析每个 Promise 的状态，即使其中一些 Promise 失败。
总结
ES9 增加的 Promise.allSettled() 方法解决了 Promise.all() 方法的错误处理问题。使用 Promise.allSettled() 方法，我们可以轻松地捕捉所有 Promise 的结果，不管它们成功或失败。在某些情况下，知道每个 Promise 的状态很重要，这使我们能够在解决错误时更有效地处理异步操作。
示例代码
// javascriptcn.com 代码示例
let promise1 = Promise.resolve(1);
let promise2 = Promise.reject(2);
let promise3 = Promise.resolve(3);
Promise.allSettled([promise1, promise2, promise3])
.then(results => {
console.log(results);
results.forEach(result => {
if(result.status === 'fulfilled') {
console.log(`Resolved: ${result.value}`);
} else {
console.error(`Rejected: ${result.value}`);
}
});
})来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/654729567d4982a6eb1885fa