在前端开发中，Promise 作为一种常用的异步编程方式，往往用于处理复杂的异步操作，解决了回调地狱的问题，提高了代码的可读性和维护性。然而，对于错误处理，Promise 也能提供多种方案，为我们避免出现不必要的错误，同时提高了代码的安全性与可靠性。本篇文章将总结从 Promise 的错误捕捉到错误处理的全过程，并提供示例代码，以帮助我们更好地理解 Promise 的错误处理方式。
Promise 捕捉错误的方式
在一个异步操作中，如果出现了意外错误，我们必须捕捉和处理这些错误，以确保我们没有留下任何潜在的漏洞。Promise 提供了两种捕捉错误的方式：catch 和 then。
then() 方法的错误处理方法
我们都知道，Promise 的 then 方法返回的是一个新的 Promise 对象，我们可以在这个对象上使用 catch 方法来处理错误，具体示例如下：
-- -------------------- ---- -------
--- ----------------- ------- -- -
------------- -- -
--------------- ---------
-- ------
--
-------------- -- -
----------------------
--
------------ -- -
-------------------
---在这个例子中，当 Promise 对象被 reject 后，我们会在 then 方法的回调函数中抓取到这个错误，并且在 catch 方法中输出错误信息：
$ timeout error!
then() 方法的多个回调函数中的错误
除了使用 catch 方法以外，我们也可以将错误处理添加到 then 方法中的多个回调函数中，以针对不同类型的错误有不同的处理方法：
-- -------------------- ---- -------
--- ----------------- ------- -- -
-------------------
--
------
-------- -- -
----------------------
----- --- --------- ----- --- ------------
--
----- -- -
------------------- -- ---------------
-
-
------------ -- -
------------------ ------ -- ---------------
---在这个例子中，我们将一个错误添加到 Promise 对象的第一个 then 方法回调函数中，同时在第二个回调函数中添加一段用于处理错误的代码。当 Promise 对象 reject 后，我们会在 catch 方法中抓取到这个错误，它会打印出错误信息：
$ Catch Error: an error has occurred!
这种错误处理可以让我们在不同步骤中知道错误的具体信息，并且根据不同类型的错误采取不同的处理方式。
catch() 方法的基本错误处理
将 catch 方法用于 Promise 对象可以将 Promise 对象中的错误信息抓取到，这样我们就可以在控制台中看到 Promise 对象的错误信息。下面是一个基本的错误处理示例：
new Promise((resolve, reject) => {
reject('an error has occurred!');
})
.catch(error => {
console.log(error);
});这个例子中，我们在 Promise 对象中添加了一个错误，当 Promise 对象被 reject 时，我们可以在 catch 方法中输出错误信息：
$ an error has occurred!
Promise 错误处理的更多实例
下面的示例演示了如何在 Promise 中捕捉多个错误，以及如何删除错误信息。还展示了如何在 try/catch 语句中使用 Promise：
-- -------------------- ---- ------- ------------------ ----------- -- - ------ ------------------ --------- ----- --- ------------- -- ------------ -- - --------------------------- ------ ------------------------- -- ----------- -- - ------------------- -- ------------ -- - --------------------------- ------ ----------------------- ---
在这个示例中，我们首先返回了一个 resolved 的 Promise 对象，然后在第一个 then 方法中添加了一个错误，这个错误会被抓取并在 catch 方法中输出。接着在第二个 then 方法中，我们对错误信息进行修改，将错误信息加上 ++ 的运算符并打印出来。在第二个 then 方法的最后，我们在 catch 方法中捕捉错误并返回一个 resolved 的 Promise 对象。最终，我们会收到如下输出：
$ an error has occurred! $ 1
除了上面的示例之外，我们还可以使用 async/await 增强 Promise 的错误处理能力：
-- -------------------- ---- -------
----- -------- --------- -
--- -
----- ----- - ----- --- ----------------- ------- -- -
------------- -- -
-------------------
-- ------
---
----- --- --------- ----- --- ------------
- ----- ------- -
---------------------------
-
-
----------我们会在上面的示例中使用 async/await 对 Promise 进行操作。在这个示例中，我们首先在 try 块中声明了一个变量 value，并等待一个 resolved 的 Promise 对象，然后在下一个行为再次 throw 了一个 Error 对象。在 catch 块中，我们捕捉这个错误，然后打印这个错误信息：
$ an error has occurred!
给 Promise 提供错误处理的最佳实践
- 记得用一个
catch块结束每个 promise 链。 - 如果在一个 promise 链中的某个地方出现了错误，那么剩下的 promise 都不会执行。 如：
-- -------------------- ---- -------
-----------------------
------------ -- -
----- --- -------- ------- -----------
----------------- ---- --- -- ----------
--
------------ -- -
------------------- -- ----- -----------------
--
------------ -- -
-------------------
---- 必要时创建和使用
Error对象（而不是字符串）来捕获和处理错误。如:
-- -------------------- ---- -------
-------------
---------------- -- -
-- -------------- -
----- --- ----------- -------- ---------------------
-
--
-------- -- -
-------------------- ------------
--
------------ -- -
----------------------- -------------
---- 尝试使用
finally完成特定的清理任务。如：
-- -------------------- ---- -------
-------------
---------------- -- -
-------------------- ---------- -------- --------- -----------------
--
------------ -- -
----------------------- -------------
--
----------- -- -
----------------- ---- --- -- ------ -------
---在最后一个例子中，finally 包含一些代码，这些代码在 promise 被 settled 时执行，无论是 resolved 还是 rejected。例如，使用 finally() 在 promise 结束时关闭文件或释放资源。使用 finally() 可以帮助您确保清理代码在成功或失败时总是运行。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/646e2dbc968c7c53b0cbc4f8