理解 Promise 的 then 方法
在 JavaScript 前端开发中，异步编程是一种不可避免的问题。Promise 是一种用于处理异步操作的对象，它可以使异步代码更加简洁和易于理解。
Promise 的 then 方法是 Promise 对象中最常用的方法之一。在本文中，我们将深入了解 Promise 的 then 方法，并了解如何正确使用它来处理异步操作。
- then 方法基础
在 Promise 中，then 方法用于定义异步操作成功后要执行的代码。then 方法的基本用法如下：
promise.then(onFulfilled, onRejected);
其中，promise 是一个 Promise 对象，onFulfilled 是一个成功后要执行的回调函数，onRejected 是一个失败后要执行的回调函数。
当 Promise 对象的状态由 pending 变为 fulfilled 时，onFulfilled 函数将被执行；如果状态由 pending 变为 rejected，则 onRejected 函数将被执行。
例如，我们可以使用 Promise 来模拟一个异步操作：
-- -------------------- ---- -------
----- ------- - --- ----------------- ------- -- -
------------- -- -
--------------------
-- ------
---
-------------
-------- -- -
--------------------
--
------- -- -
-------------------
-
--在上面的代码中，我们首先创建了一个 Promise 对象，它在 1 秒钟后将状态改为 fulfilled 并返回一个字符串 "Success!"。然后，我们使用 then 方法来定义当 Promise 对象成功时要执行的回调函数和失败时要执行的回调函数。在本例中，onFulfilled 回调函数将打印 "Success!"。
- 多个 then 方法的链接
Promise 的 then 方法可以链式调用。这意味着在一个 then 方法中返回的 Promise 对象可以继续被下一个 then 方法使用。
例如：
-- -------------------- ---- -------
----- ------- - --- ----------------- ------- -- -
------------- -- -
-----------
-- ------
---
-------
-------------- -- -
-------------------- -- -
------ ------ - --
--
-------------- -- -
-------------------- -- -
------ ------ - --
--
-------------- -- -
-------------------- -- -
---在上面的代码中，我们首先创建了一个 Promise 对象，它在 2 秒钟后将状态改为 fulfilled 并返回数字 1。
然后，我们使用 then 方法两次。第一次 then 方法将数字 1 作为参数，并返回数字 2。第二次 then 方法将数字 2 作为参数，并返回数字 4。
需要注意的是，每个 then 方法都返回一个新的 Promise 对象。在前面的例子中，第一个 then 方法返回的 Promise 对象是第二个 then 方法使用的对象。
- 处理异常
Promise 的 then 方法也可以处理异常情况。在 then 方法中，onRejected 回调函数被用于处理 Promise 对象在 pending 状态下出现异常的情况。
例如：
-- -------------------- ---- -------
----- ------- - --- ----------------- ------- -- -
------------- -- -
---------- ---------------- ---- ----------
-- ------
---
-------------
-------- -- -
-------------------- -- --------
--
------- -- -
--------------------------- -- --------- ---- ------
-
--在上面的例子中，Promise 对象在 2 秒钟后将状态改为 rejected，并返回一个包含错误消息的 Error 对象。
当 Promise 对象的状态为 rejected 时，then 方法将触发 onRejected 回调函数，并将错误对象作为参数传递给回调函数。
- 返回一个新的 Promise 对象
在 then 方法中，我们也可以返回一个新的 Promise 对象。这允许我们在异步操作完成后执行多个 then 方法，并将结果传递给下一个 then 方法。
例如：
-- -------------------- ---- -------
----- ------- - --- ----------------- ------- -- -
------------- -- -
-----------
-- ------
---
-------
-------------- -- -
-------------------- -- -
------ --- ----------------- ------- -- -
------------- -- -
-------------- - ---
-- ------
---
--
-------------- -- -
-------------------- -- -
---在上面的代码中，我们首先创建了一个 Promise 对象，它在 2 秒钟后将状态改为 fulfilled 并返回数字 1。
然后，我们使用第一个 then 方法返回一个新的 Promise 对象，它在 2 秒钟后将状态改为 fulfilled 并返回数字 2。
在第二个 then 方法中，我们接收到数字 2 并将其打印到控制台上。
- 结论
理解 Promise 的 then 方法可以帮助我们更好地处理异步操作。我们可以将 then 方法与 Promise 的状态变化相结合，以及使用多个 then 方法链接以及异常处理。
正确地使用 then 方法可以使我们的代码更加结构化和易于维护，同时也可以提高我们的代码质量和可读性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/672f6206eedcc8a97c8e32da