引言
Promise 是 JavaScript 中编写异步代码时的重要工具之一，它允许把代码分为不同的阶段，使代码更加清晰易读。但是，即使 Promise 的模式看起来是完美的，它仍然充满了错误和问题。当 Promise 出错时，我们需要知道如何优雅地捕获错误并处理它们。本文将深入讨论 Promise 错误处理的方法和技巧。
Promise 异常处理
在 JavaScript 中，Promise 如果执行正常，它将返回一个 resolved 状态的 Promise，否则，它将返回一个 rejected 状态的 Promise。在 Promise 中处理错误是一个至关重要的问题。以下是一些常用的 Promise 异常处理方法：
.catch()
.catch() 可以用于捕捉 Promise 中的错误，并允许您在出现错误时执行操作。它为您提供了一种方法来定义错误处理程序，以便在 Promise 出现拒绝状态时执行。例如：
fetch("https://example.com")
.then(response => response.json())
.catch(error => console.error(error));上面的示例中，我们使用 .catch() 拦截了错误并将其打印到控制台。
try...catch
尽管 .catch() 会处理大多数 Promise 异常，但是在某些情况下，您可能需要使用 try…catch 块。当使用列出多个 Promise 的复杂代码时，在 catch 块中将包括所有此类 Promise 的错误。例如：
try {
const result = await Promise.all([Promise1(), Promise2()]);
} catch (error) {
console.error(error);
}上面的示例中，我们使用了 Promise.all() 对多个 Promise 进行了必要的错误处理。
多次使用 catch
在实现 Promise 链时，您可能在多个位置使用 .catch() 方法处理错误。如果您使用两个 .catch() 方法在链的不同位置处理错误，则最终将始终执行离例子的最近一个 catch 块。例如：
.catch(error => console.error("First catch block", error))
…
.catch(error => console.error("Second catch block", error));在上面的示例中，最终的 catch 块将始终执行。
捕获结果
优秀的代码应该不仅能够预测意料之外的错误，还要准确地识别这些错误。有时，Promise 的异常处理程序需要处理具体的错误。例如：
fetch("/articles")
.then(response => {
if (!response.ok) {
throw new Error("HTTP Error");
}
return response;
})
.catch(error => console.error(error));在上面的示例中，我们使用 .ok 属性来检查 HTTP 响应是否成功，并在失败时抛出错误。
抛出错误
除了用 throw 关键字直接抛出出现的错误之外，还可以返回 rejected 状态的 Promise，从而将错误传递给 .catch() 方法。例如：
-- -------------------- ---- -------
-------- ----------- -
------ --- ----------------- ------- -- -
----- ---- - --------------- -- ------- --- ----
-- ------ -
--------------
- ---- -
---------- ----------- --- ---------
-
---
-
----------
---------- -- ------------------
------------ -- ----------------------在上面的示例中，当用户找不到时将返回一个 rejected 状态的 Promise，并且在 .catch() 中处理该错误。
结论
在 Promise 的链中处理错误时，请使用 .catch() 或 try…catch 块。如果可能，尽可能使用一次 catch，多次使用 catch 将导致第一个 catch 失去作用。在实现 Promise 异常处理时，请尽可能的详细说明错误类型以及如何解决错误，这样可以更好的明确并定位问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6704a709d91dce0dc84faa7b