ES10 中使用 Promise.allSettled() 轻松解决 Promise.all 的问题
在前端开发中，经常需要使用 Promise 作为异步操作的解决方案。对于 Promise.all，我们知道它可以将多个 Promise 实例包装成一个新的 Promise 实例，并等待所有 Promise 实例完成，然后返回一个由所有 Promise 实例状态组成的数组。但是，当有一个 Promise 实例被 rejected 时，Promise.all 就会立即抛出错误。
那么，有没有一种解决方案可以让我们在所有 Promise 实例完成后获取它们的状态，而不会因为其中一个 Promise 实例的状态为 rejected 而立即抛出错误呢？答案是肯定的，这就是在 ES10 中新增的 Promise.allSettled。
Promise.allSettled 接受一个由多个Promise实例组成的可迭代对象，并返回一个新的 Promise 实例，该实例在所有 Promise 实例执行完毕后会将所有 Promise 实例的结果状态（fulfilled 或 rejected）组成一个对象数组返回。与 Promise.all 不同，Promise.allSettled 不会抛出错误，即使其中一个 Promise 实例状态为 rejected。
让我们看一个简单的例子：
const promise1 = Promise.resolve(1);
const promise2 = new Promise((resolve, reject) => setTimeout(reject, 1000, 'failed message'));
const promise3 = new Promise((resolve) => setTimeout(resolve, 2000, 'success message'));
Promise.allSettled([promise1, promise2, promise3])
.then((results) => {
console.log(results);
});这段代码中，我们创建了三个 Promise 实例，promise1 会立即 resolve，promise2 会 1000ms 后 reject，promise3 会 2000ms 后 resolve。我们将这三个 Promise 实例传入 Promise.allSettled，然后在 then 中输出结果。
输出结果为：
[
{ status: 'fulfilled', value: 1 },
{ status: 'rejected', reason: 'failed message' },
{ status: 'fulfilled', value: 'success message' }
]可以看到，Promise.allSettled 返回了一个数组，该数组包含了所有 Promise 实例的状态及其对应的值或原因。在我们的例子中，promise2 的状态为 rejected，但是 Promise.allSettled 并没有抛出错误，而是返回了该 Promise 的状态和原因。
有了 Promise.allSettled，我们可以更加灵活地处理异步操作返回的结果。例如，我们可以先等待所有操作完成后再根据每个操作的状态来分别处理它们的返回值或错误信息。
总结
在 ES10 中，Promise.allSettled 的出现为我们处理多个异步操作的返回结果带来了更大的灵活性。其可以等待所有 Promise 实例完成后一次性返回它们的状态及对应的值或原因，而不会因为其中某个 Promise 实例的状态为 rejected 而立即抛出错误。使用 Promise.allSettled 可以帮助我们更好地管理异步操作带来的复杂性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64965c7148841e989436fc2c