异步编程在前端开发中是非常常见的。在以前，我们使用回调函数、Promise等方式来解决异步代码的问题，但这些方式会让代码变得复杂、难以维护，而 ECMAScript 2019 中新增的 async 和 await 关键字可以有效简化异步编程。
async 和 await 的介绍
async 和 await 是ES2017（通常称为ES8）中新增的关键字，它们是用来解决异步编程中回调地狱的问题的。async 关键字用来定义一个返回 Promise 对象的函数，await 关键字用来暂停 async 函数的执行，等待 Promise 对象 resolve 后再继续执行。
下面是一个简单的例子：
----- -------- --------------- - ------------------- -------- ----- ------------------ ------------------ -------- - ----------------
输出结果为：
------ ----- ----- -----
可以看到，在执行 Promise 的 resolve 方法之前，async 函数会停止执行，等待 Promise resolve 后再继续执行，从而达到简化异步编程的目的。
使用 async 和 await 简化异步操作
异步函数返回 Promise 对象
在使用 async 关键字定义的函数中，无论函数是否有返回值，函数最终都会返回一个 Promise 对象。
----- -------- --------------- - ------ ---- - -------------------------- -- -------------------- -- ----- ---
使用 await 简化 Promise
使用 await 关键字可以有效简化 Promise 的用法。在 await 后面跟上一个 Promise 对象，如果该 Promise resolve，则会返回 resolve 的结果，如果该 Promise reject，则会直接抛出异常。
----- -------- --------------- - ----- ------ - ----- --------------------- -------------------- - ---------------- -- ----- ---
错误处理
在使用 await 的过程中，如果 Promise reject，则会直接抛出异常，代码进入 rejected 状态，我们可以通过 try-catch 语句来捕捉这个异常，然后进行错误处理。
----- -------- --------------- -
--- -
----- ------ - ----- ------------------ ---------------- ----------
- ----- ------- -
---------------------
-
-
---------------- -- ----- ------ --------- ------处理多个异步操作
使用 async 和 await 还可以很方便地处理多个异步操作。我们只需要将多个异步操作放到一个 async 函数中，然后在每个操作上使用 await 关键字等待结果即可。
----- -------- --------------- - ----- ------- - ----- -------------------- ----- ------- - ----- -------------------- ----- ------- - ----- -------------------- -------------------- -------- --------- - ----------------
可以看到，在这个例子中，我们使用了多个 await 来等待多个异步操作的结果，最终将结果进行输出。
总结
使用 async 和 await 可以很方便地进行异步编程，它们可以有效地解决异步编程中的回调地狱问题，让代码更简洁、易维护。我们在编写异步操作代码时可以考虑使用 async 和 await 来简化代码。
示例代码
----- -------- ------------------- -
------ ---------------------------
-
----- -------- ------------------- -
------ ---------------------------
-
----- -------- ------------------- -
------ ---------------------------
-
----- -------- --------------- -
--- -
----- ------- - ----- --------------------
----- ------- - ----- --------------------
----- ------- - ----- --------------------
-------------------- -------- ---------
- ----- ------- -
---------------------
-
-
----------------来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/664ff2d6d3423812e41c00f7