在前端开发中，经常需要通过 Ajax 请求获取数据。但是，由于 Ajax 请求是异步的，因此需要使用回调函数来处理请求的结果。这使得代码变得复杂，并且难以维护。为了解决这个问题，ECMAScript 2017 引入了 Promise，它可以使异步代码更加简洁和易于理解。
Promise 的基本概念
Promise 是一种用于处理异步操作的对象。它代表了一个尚未完成但预计将在未来完成的操作。Promise 对象有三种状态：pending（等待中）、fulfilled（已成功）和 rejected（已失败）。当 Promise 对象的状态从 pending 转变为 fulfilled 或 rejected 时，称为 Promise 对象已 settled。
Promise 对象有两个重要的方法：then() 和 catch()。then() 方法用于处理 Promise 对象的成功状态，catch() 方法用于处理 Promise 对象的失败状态。
使用 Promise 处理 Ajax 请求
在传统的 Ajax 请求中，我们需要使用回调函数来处理请求的结果。例如：
-- -------------------- ---- -------
-------- ----------------- -
--- --- - --- -----------------
--------------- ---------
---------- - ---------- -
-- ----------- --- ---- -
-------------- ------------------
- ---- -
-------------------------
-
--
----------- - ---------- -
-------------------------
--
-----------
-
--------------------- ----- -
-- ----- -
-------------------
- ---- -
------------------
-
---上面的代码使用了回调函数来处理 Ajax 请求的结果，这使得代码变得复杂并难以维护。使用 Promise 可以使代码更加简洁和易于理解。例如：
-- -------------------- ---- -------
-------- --------- -
------ --- ------------------------- ------- -
--- --- - --- -----------------
--------------- ---------
---------- - ---------- -
-- ----------- --- ---- -
--------------------------
- ---- -
-----------------------
-
--
----------- - ---------- -
-----------------------
--
-----------
---
-
---------
-------------------- -
------------------
--
-------------------- -
-------------------
---上面的代码使用 Promise 来处理 Ajax 请求的结果。首先，我们创建一个 Promise 对象，然后在 Promise 对象的构造函数中执行 Ajax 请求。当 Ajax 请求成功时，调用 resolve() 方法并传递请求结果；当 Ajax 请求失败时，调用 reject() 方法并传递错误信息。最后，我们使用 then() 方法来处理 Promise 对象的成功状态，使用 catch() 方法来处理 Promise 对象的失败状态。
Promise 的链式调用
Promise 对象的 then() 方法可以返回一个新的 Promise 对象，从而实现链式调用。例如：
-- -------------------- ---- -------
-------- --------- -
------ --- ------------------------- ------- -
--- --- - --- -----------------
--------------- ---------
---------- - ---------- -
-- ----------- --- ---- -
--------------------------
- ---- -
-----------------------
-
--
----------- - ---------- -
-----------------------
--
-----------
---
-
---------
-------------------- -
------------------
------ -----------------
--
-------------------- -
------------------
--
-------------------- -
-------------------
---上面的代码中，第一个 then() 方法返回一个新的 Promise 对象，并将其传递给第二个 then() 方法。第二个 then() 方法可以处理第一个 then() 方法返回的 Promise 对象的成功状态。如果任何一个 then() 方法或 catch() 方法抛出异常，则将导致链式调用的中断，并调用最近的 catch() 方法。
结论
Promise 是一种用于处理异步操作的对象，它可以使异步代码更加简洁和易于理解。在处理 Ajax 请求时，使用 Promise 可以使代码更加简洁和易于维护。除此之外，Promise 还可以实现链式调用，使得代码更加模块化和可读性更强。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/675ac80e4b9d41201abb9c30