Promise 是一种异步编程的解决方案，可以有效地避免 JavaScript 中的回调地狱。该对象最初由社区提出，后来被 ES6 引入并成为 ES2021 语言规范的一部分，目前已成为常用的前端开发工具之一。在本文中，我们将探讨如何使用 ECMAScript 2021 中的 Promise 对象，并给出具体的实例演示。
Promise 简介
Promise 是一个对象，代表异步操作的最终完成或失败，返回的结果是一个唯一的值。Promise 的状态分为三种：pending（进行中）、fulfilled（已成功）和 rejected（已失败）。当一个 Promise 对象的状态从 pending 变为 fulfilled 或 rejected，则称为 Promise 对象“已解决”（resolved）。如下代码示例：
----- ------- - --- ----------------- ------- -- -
-- -------------- - ---- -
------------------
- ---- -
----------------
-
--Promise 基础用法
大多数 Promise 实例的使用方式都是类似的。Promise 构造函数接受一个函数作为参数，该函数接受两个函数参数 resolve 和 reject。当 Promise 被 resolve 和 reject 调用时，该 Promise 实例的状态就会改变。如下是一个简单的 Promise 实例，返回一个字符串“Hello World”，并输出到控制台：
----- ------- - --- ----------------- ------- -- - -------------- ------- -- ----------------------- -- - --------------------- --
当 Promise 对象状态从 pending 变为 fulfilled，then 方法会调用成功的回调函数，而当状态从 pending 变为 rejected，则会调用失败的回调函数。then 方法接受两个回调函数，一个成功回调函数和一个失败回调函数。如下是一个带有异常处理的 Promise 实例：
----- ------- - --- ----------------- ------- -- -
--- -
----- ------ - - - -
---------------
- ----- ------- -
-------------
-
--
-------
---------------- -- -
---------------------
--
-------------- -- -
------------------
--Promise 链式操作
Promise 可以实现链式操作，即多个 then 方法的调用。在前一个 then 方法中，可以返回一个新的 Promise 对象，实现链式调用。如下是一个返回 Promise 实例的方法，该方法用于模拟异步请求：
----- ------- - ----- -- -
------ --- ----------------- ------- -- -
------------- -- -
----------------- ---- --------
-- ------------- - -----
--
-这里可以使用链式调用实现对多个请求的处理：
-----------------------------------------------
---------------- -- -
---------------------
------ ---------------------------------------------------------
--
---------------- -- -
---------------------
------ ------------------------------------------------------------
--
---------------- -- -
---------------------
--
-------------- -- -
--------------------
--Promise.all() 方法
Promise.all 方法接受一个 Promise 数组，如果数组中所有 Promise 都已经 resolve，则返回一个 resolve 状态的 Promise，否则返回一个 reject 状态的 Promise。如下代码示例：
-------------
------------------------------------------------
----------------------------------------------------------
------------------------------------------------------------
--
----------------- -- -
----------------------
--
-------------- -- -
--------------------
--Promise.race() 方法
Promise.race 方法接受一个 Promise 数组，只有数组中的第一个 Promise resolve 或 reject 状态，该方法就会返回一个 resolve 或 reject 状态的 Promise。如下代码示例：
--------------
------------------------------------------------
----------------------------------------------------------
------------------------------------------------------------
--
---------------- -- -
---------------------
--
-------------- -- -
--------------------
--总结
在前端开发中，异步操作是常见的需求。Promise 通过其优良的异步解决方案，简化了从 Promise 实例的创建、链式调用以及 Promise.all 和 Promise.race 方法的使用等操作，使得异步操作更加轻松自如。使用 Promise 可以大大提高开发效率，建议前端开发者学习并掌握该技术。
参考资料
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/646e708b968c7c53b0ce2b5e