JavaScript Promise.allSettled()详解：处理异步结果的最佳实践

你是否曾在JavaScript开发中遇到过这样的情况：使用Promise时，只要有一个请求被拒绝，整个流程就会中断，导致其他成功的结果无法获取？

当你编写基于Promise的代码时，起初一切顺利，但一旦某个小环节出现拒绝（rejected），整个调用链就会崩溃。

代码随之停止运行，你可能会疑惑：为什么JavaScript不能忽略这个错误，继续执行剩余的操作呢？

好消息是，有一个新的解决方案：Promise.allSettled()。它是你从未意识到自己需要，但一旦使用就会离不开的Promise工具。Promise.allSettled()允许你等待所有Promise完成（无论是解决还是拒绝），然后根据具体结果进行后续处理。

从此告别因单个Promise拒绝而导致的链式崩溃或未处理的错误。让我们深入探讨这个强大且实用的方法，看看它如何简化你的异步JavaScript代码。

什么是Promise.allSettled()？

如果你想知道如何使用JavaScript的Promise.allSettled()方法，但不确定其工作原理或使用场景，不用担心，本文将为你详细解答。

Promise.allSettled()会等待传入的所有Promise完成，这里的“完成”指的是被解决（fulfilled）或被拒绝（rejected）。随后，它返回一个数组，其中包含每个Promise的状态以及对应的值或拒绝原因。

这种方法在确保多个异步任务全部完成，且你并不关心其中某些任务是否失败的场景下非常有用。

例如，假设你有三个返回Promise的API调用，你希望从成功的调用中获取所有数据，即使其中一个调用失败。你可以这样实现：

 Promise.allSettled([apiCall1(), apiCall2(), apiCall3()]).then((results) => {});

这段代码会并行执行三个API调用，并在它们全部完成后调用.then()回调。返回的结果数组将包含三个对象：每个Promise对应一个对象，状态为“fulfilled”时包含数据，状态为“rejected”时包含错误信息。

你可以过滤出状态为“fulfilled”的结果，然后继续使用这些成功获取的数据。

使用Promise.allSettled()时需要记住的关键点：

Promise.allSettled()会等待所有输入的Promise完成，并返回它们的结果。
“完成”包括解决（fulfilled）和拒绝（rejected）两种状态。
它返回一个对象数组，每个对象包含对应输入Promise的状态以及值或拒绝原因。
即使有Promise被拒绝，它依然允许你处理那些成功的Promise。

与Promise.all()的对比：Promise.allSettled()的优势

Promise.all()用于等待多个Promise完成并获取所有解析值的数组。但它有一个主要缺点：如果其中任何一个Promise被拒绝，整个Promise.all()返回的Promise会立即被拒绝。

这在某些场景下可能带来问题。例如，假设你向三个不同的后端服务发起请求，只要其他两个服务成功，你并不关心其中一个是否失败。如果使用Promise.all()，单个被拒绝的Promise会导致整个组被拒绝，从而让你错过其他Promise的成功响应。

解决方案是Promise.allSettled()。它的工作方式与Promise.all()类似，但如果任何Promise被拒绝，它不会立即拒绝，而是等待所有Promise完成（解决或拒绝），然后返回一个对象数组，包含每个Promise的状态和值/原因。

示例代码如下：

Promise.allSettled([
   Promise.resolve(1),
   Promise.reject(new Error("2")),
   Promise.resolve(3),
 ]).then((results) => {
   // results is an array of:
   // {status: "fulfilled", value: 1}
   // {status: "rejected", reason: Error}
   // {status: "fulfilled", value: 3}
 });

如代码所示，即使第二个Promise被拒绝，我们仍然可以从其他Promise中获取解析值。这使得我们能够优雅地处理拒绝，而不会丢失任何成功的响应。

Promise.allSettled()在此类场景中提供了更大的灵活性。你可以全面了解所有Promise的状态，无论是否有拒绝发生，从而有机会利用任何已解决的值，并适当处理拒绝情况。

因此，下次当你需要等待多个Promise完成，且不希望因单个拒绝而错过其他已解决的值时，请务必使用Promise.allSettled()！这是Promise API中一个非常有用的补充。

常见问题：关于Promise.allSettled()

Promise.allSettled()会减慢我的代码速度吗？

并不会。Promise.allSettled()只是等待传入的所有Promise通过履行或拒绝来完成。它不会执行其他影响性能的操作。

我还能在Promise.allSettled()中发现错误吗？

是的，完全可以！Promise.allSettled()会提供每个Promise的结果，无论是履行还是拒绝。

对于任何被拒绝的Promise，你都会得到拒绝的原因，通常是一个错误对象。你可以在Promise.allSettled()的回调处理程序中捕获这些错误。

我应该何时使用Promise.allSettled()与Promise.all()？

当你希望并行运行多个Promise，但不希望单个被拒绝的Promise导致整个组被拒绝时，使用Promise.allSettled()。

例如，如果你从多个第三方API获取数据，一个API被拒绝的Promise不应阻止你从其他API获取数据。

当你希望并行运行Promise，但需要它们全部成功完成才能使代码继续运行时，使用Promise.all()。

例如，如果你需要从两个API获取数据以在页面上显示，则希望在呈现数据之前满足这两个Promise。

我能得到已达成的Promise的结果吗？

可以！Promise.allSettled()返回一个对象数组，包含每个Promise的状态和值/原因。示例如下：

Promise.allSettled([
   Promise.resolve(1),
   Promise.reject(new Error("2")),
   Promise.resolve(3),
 ]).then((results) => {
   console.log(results);
   /*
     [
       { status: "fulfilled", value: 1 },
       { status: "rejected", reason: Error: 2 },
       { status: "fulfilled", value: 3 }
     ]
     */
 });

你将获得所有Promise的信息，无论它们是履行还是拒绝，从而全面了解并行操作的结果。

结论

以上就是Promise.allSettled()的介绍。这是一个你可能从未意识到自己需要，但非常便捷的方法。

你不再需要仅用Promise.all()配合try/catch来处理潜在的拒绝。你可以让Promise.allSettled()为你处理所有这些事情，只关注已解决的值。你的异步代码将更加干净且易于阅读。

到此这篇关于如何在JavaScript中使用Promise.allSettled()的文章就介绍到这了，更多相关JavaScript使用Promise.allSettled()内容请搜索本站以前的文章或继续浏览下面的相关文章，希望大家以后多多支持本站！

JavaScript中Promise.allSettled()的使用指南