在前端开发中，Promise 是一种常见的异步编程解决方案。Promise 可以帮助我们更好地管理异步操作，避免回调地狱。但是，当我们需要多次调用.then() 方法时，就会出现一些问题。本文将介绍如何手写 Promise，以解决多次.then() 方法的问题。
Promise 的基本概念
Promise 是一种异步编程解决方案，它可以将异步操作转换为同步操作，避免回调地狱。Promise 有三种状态：
- Pending（进行中）
- Fulfilled（已成功）
- Rejected（已失败）
当 Promise 的状态从 Pending 转变为 Fulfilled 或 Rejected 时，就称为 Promise 已经 settled（已完成）。
手写 Promise
接下来，我们将手写一个 Promise，以解决多次.then() 方法的问题。首先，我们需要定义 Promise 的基本结构：
-- -------------------- ---- -------
----- ------- -
--------------------- -
-- ------- ------ -------
---------- - ----------
-- ------- ----
---------- - ----------
-- ------- -----
----------- - ----------
-- -- ---- -------
------------------------ - ---
------------------------ - ---
-- -- -------- --
--- -
--------------------------------- ------------------------
- ----- ------- -
-------------------
-
-
-- ------- - ------- --
-------------- -
-- --- ------- ---- ------- ------ ---------
-- ----------- --- ---------- -
---------- - ------------
---------- - ------
-- -- ---- -------
----------------------------------------- -- ------------
-
-
-- ------- - ------ --
-------------- -
-- --- ------- ---- ------- ------ --------
-- ----------- --- ---------- -
---------- - -----------
----------- - -------
-- -- ---- -------
----------------------------------------- -- ------------
-
-
-- ------- - ---- --
----------------- ----------- -
-- -- ----------- - ---------- ----------
----------- - ------ ----------- --- ---------- - ----------- - ----- -- ------
---------- - ------ ---------- --- ---------- - ---------- - ------ -- - ----- ------ --
-- ------ -------
----- -------- - --- ----------------- ------- -- -
-- ----------- --- ------------ -
-- -- ------- ---- ------------- ----------- --
------------- -- -
--- -
----- - - ------------------------
----------------------------- -- -------- --------
- ----- ------- -
--------------
-
-- ---
- ---- -- ----------- --- ----------- -
-- -- ------- ---- ------------ ---------- --
------------- -- -
--- -
----- - - ------------------------
----------------------------- -- -------- --------
- ----- ------- -
--------------
-
-- ---
- ---- -
-- -- ------- ---- ------------------
-------------------------------- -- -
------------- -- -
--- -
----- - - ------------------------
----------------------------- -- -------- --------
- ----- ------- -
--------------
-
-- ---
---
-------------------------------- -- -
------------- -- -
--- -
----- - - ------------------------
----------------------------- -- -------- --------
- ----- ------- -
--------------
-
-- ---
---
-
---
------ ---------
-
-- -- ------- ------
------------------------ -- -------- ------- -
-- --------- --- -- -
------ ---------- ------------------- ----- -------- --- -----------
-
--- ------ - ------
-- -- ---------- -------- -
------------ -- -
----------------------------- ------ -------- --------
-- ------ -- -
-- -------- -------
------ - -----
---------------
---
- ---- -- -- --- ---- -- ------- - --- -------- -- ------ - --- ------------ -
--- -
----- ---- - -------
-- ------- ---- --- ----------- -
------------ ----- -- -
-- -------- -------
------ - -----
----------------------------- ------ -------- --------
-- ------ -- -
-- -------- -------
------ - -----
---------------
---
- ---- -
-----------
-
- ----- ------- -
-- -------- -------
------ - -----
--------------
-
- ---- -
-----------
-
-
-在上述代码中，我们定义了 Promise 的基本结构，并实现了 Promise 的 resolve、reject 和 then 方法。同时，我们还实现了 Promise 返回值的处理，以解决多次.then() 方法的问题。
示例代码
接下来，我们将使用上述手写的 Promise，并编写一段示例代码：
-- -------------------- ---- -------
----- ------- - --- ----------------- ------- -- -
------------- -- -
--------------- -----------
-- ------
---
-------
----------- -- -
-------------------
------ --- --------------- -- -
------------- -- -
--------------- ------- ---------
-- ------
---
--
----------- -- -
-------------------
---在上述代码中，我们定义了一个 Promise，它将在 1 秒钟后 resolved，并输出字符串 'Hello, Promise!'。然后，我们使用第一个.then() 方法返回一个新的 Promise，它将在 1 秒钟后 resolved，并输出字符串 'Hello, Promise again!'。
通过运行上述代码，我们可以看到，它成功地解决了多次.then() 方法的问题，并输出了两个字符串。
总结
通过手写 Promise，我们深入了解了 Promise 的基本概念和实现方式，并解决了多次.then() 方法的问题。在实际开发中，我们可以使用 Promise 来更好地管理异步操作，提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/656fd96fd2f5e1655d844107