在前端开发中，Promise 是一种非常常见的异步编程方式。它可以使代码更加可读、可维护，同时也可以避免回调地狱的问题。然而，在使用 Promise 的过程中，我们也经常会遇到 Promise 中的错误信息传递不正确的问题。本文将介绍如何正确地传递 Promise 中的错误，让我们的代码更加健壮、可靠。
Promise 基础
在了解如何传递 Promise 中的错误之前，我们需要先了解一些 Promise 的基础知识：
- Promise 有三种状态：进行中（pending）、已完成（fulfilled）和已拒绝（rejected）。
- Promise 对象可以通过 then() 方法注册回调函数处理 resolved 和 rejected 状态的结果。
- Promise 对象可以通过 catch() 方法捕获 rejected 状态的错误。
以下是一个简单的 Promise 示例：
-- -------------------- ---- -------
----- ------- - --- ----------------- ------- -- -
------------- -- -
---------------- - ---- -
-------------- -- --------- --
- ---- -
---------- ------------- -- -------- --
-
-- ------
---
-------
--------- -- -----------------
---------- -- --------------------在这个示例中，我们创建了一个 Promise 对象并在其构造函数中异步执行了一些操作，如果成功了就将状态设置为 fulfilled，否则设置为 rejected。在 then() 方法中处理 fulfilled 状态的结果，在 catch() 方法中处理 rejected 状态的错误。
Promise 中错误的传递
在实际开发过程中，我们通常将一些异步操作封装成 Promise，供外部调用。如下是一个示例：
-- -------------------- ---- -------
-------- -------------- -
------ ----------
--------- -- -----------
---------- -- -
------- -- --------- --- -- -
------ ------------
- ---- -
----- --- --------------
-
---
-
----------------------------------------
--------- -- -----------------
---------- -- --------------------在这个示例中，我们封装了一个 fetchData 函数，用于获取数据并解析成 json 格式。如果请求成功并且返回数据中 code 为 0，我们就将解析后的结果返回；否则就抛出一个错误。在外部调用时，我们可以通过 then() 方法处理请求成功的结果，通过 catch() 方法处理请求失败的错误。
然而，当在 Promise 链中出现多个 then() 方法时，我们也经常会遇到错误传递不完全的问题。如下示例：
-- -------------------- ---- -------
-------- -------------- -
------ ----------
--------- -- -----------
---------- -- -
------- -- --------- --- -- -
------ ------------
- ---- -
----- --- --------------
-
---
-
----------------------------------------
--------- -- -
------------------- -----
------ ----
--
--------- -- -
------------------------
--
---------- -- --------------------在这个示例中，如果请求成功并且数据中 code 为 0，我们将解析后的结果返回；否则就抛出一个错误。在外部调用时，我们首先通过第一个 then() 方法处理请求成功的结果，并且返回结果本身，然后再通过第二个 then() 方法处理结果。如果我们将请求的链接错误地写成了 'https://www.example.com/ap'，就会导致请求失败并且抛出一个错误，但是这个错误将不会被 catch() 方法捕获到。
这是因为在第一个 then() 方法中，我们返回了一个结果而没有抛出异常。这就使得第二个 then() 方法认为请求成功并处理了结果，而没有将错误继续向下传递。为了正确地传递 Promise 中的错误，我们需要在处理完成功的结果后，将结果继续向下传递，或者将错误继续向下抛出。
正确地传递 Promise 中的错误
在 Promise 中正确地传递错误有以下三个方法：
1. 在 then() 方法中抛出错误
如果要在 then() 方法中处理成功的结果并将错误继续向下传递，我们可以直接在 then() 方法中抛出一个错误。如下示例：
-- -------------------- ---- -------
-------- -------------- -
------ ----------
--------- -- -----------
---------- -- -
------- -- --------- --- -- -
------ ------------
- ---- -
----- --- --------------
-
---
-
----------------------------------------
--------- -- -
------------------- -----
------ -- ---------- - -- -
------ ----
- ---- -
----- --- --------------
-
--
--------- -- -
------------------------
--
---------- -- --------------------在这个示例中，我们在第一个 then() 方法中判断结果是否为空，如果为空就抛出一个错误，将错误继续向下传递。在第二个 then() 方法中处理结果。如果请求失败，错误信息将被 catch() 方法捕获。
2. 在 then() 方法中返回一个 rejected 状态的 Promise
除了在 then() 方法中抛出错误，我们还可以返回一个 rejected 状态的 Promise 对象，将错误信息传递到 catch() 方法中。如下示例：
-- -------------------- ---- -------
-------- -------------- -
------ ----------
--------- -- -----------
---------- -- -
------- -- --------- --- -- -
------ ------------
- ---- -
----- --- --------------
-
---
-
----------------------------------------
--------- -- -
------------------- -----
------ -- ---------- - -- -
------ ---------------------
- ---- -
------ ------------------ ---------------
-
--
--------- -- -
------------------------
--
---------- -- --------------------在这个示例中，我们在第一个 then() 方法中判断结果是否为空，如果为空就返回一个 rejected 状态的 Promise 对象，将错误信息传递到 catch() 方法中。如果请求失败，错误信息将被 catch() 方法捕获。
3. 使用 async/await
async/await 是一个语法糖，它可以简化 Promise 的使用，同时也解决了错误信息传递不完全的问题。如下示例：
-- -------------------- ---- -------
-------- -------------- -
------ ----------
--------- -- -----------
---------- -- -
------- -- --------- --- -- -
------ ------------
- ---- -
----- --- --------------
-
---
-
----- -------- --------- -
--- -
----- --- - ----- -----------------------------------------
------------------- -----
------ -- ---------- - -- -
------------------------
- ---- -
----- --- --------------
-
- ---------- -
-------------------
-
-
----------在这个示例中，我们使用 async/await 简化了 Promise 的使用，并且通过 try/catch 语句捕获了任何错误信息。
结论
正确地传递 Promise 中的错误，可以使我们的代码更加健壮、可靠。通过本文的介绍，我们可以了解到三种正确地传递 Promise 中的错误的方法：在 then() 方法中抛出错误、在 then() 方法中返回一个 rejected 状态的 Promise 对象，或者使用 async/await。在实际开发中，我们应该根据具体情况选择合适的方法，让我们的代码更加健壮、可维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/676e6199e9a7045d0d68f1e6