在 JavaScript 中，异步编程是非常常见的。由于 JavaScript 是单线程的，当一个异步操作需要等待 I/O 完成或者跨过网络或者处理其他复杂操作时，它可以不阻塞其他操作，从而提高性能。
但是，异步编程的代价是相对复杂和困难的代码。代码嵌套和回调地狱是常见的问题，使得代码难以阅读和维护。在早期，使用 Promise 对象是解决这个问题的一种流行方式。但是，ECMAScript 2017 引入了 async/await 方法，是解决异步编程问题的更好方法。
async/await 方法如何工作
async 方法是一个用于声明异步函数（async function）的关键字。它告诉 JavaScript 编译器，这个函数需要异步返回一个 Promise 对象。因此，即使没有使用 Promise 对象，也可以使用 async/await 方法。
await 方法是一个关键字，用于等待异步函数执行完成并返回结果。如果函数执行成功并返回一个值，await 方法将返回该值。如果函数返回一个 Promise 对象，await 方法将等待 Promise 对象的解决方案完成并返回解决方案的值。
下面是一个例子：
----- -------- --------- - --- -------- - ----- ------------------- --- ---- - ----- ---------------- ------ ----- -
在这个例子中，fetch('/api/data') 方法会异步发送 HTTP 请求并返回一个 Promise 对象。await 方法会等待 Promise 对象的解决方案并返回解决方案的值。response.json() 方法也返回一个 Promise 对象，await 方法也会等待 Promise 对象的解决方案并返回解决方案的值。
常见问题解决方式
async/await 方法可以解决许多异步编程中的问题。下面是一些 async/await 的常见问题解决方式：
1. 错误处理
使用 try...catch 来处理错误，比使用 Promise catch 方法更加方便。下面是一个例子：
----- -------- --------- -
--- -
--- -------- - ----- -------------------
--- ---- - ----- ----------------
------ -----
- ----- ------- -
---------------------
------ -----
-
-在这个例子中，try...catch 语句将编写错误处理代码，以便在异常发生时捕获它。如果在使用 fetch 或 response.json 方法时发生错误，会在 catch 代码块中执行。
2. 并发执行
async/await 方法允许在函数中执行多个异步操作，从而提高性能。下面是一个例子：
----- -------- --------- -
--- ----------- ---------- ---------- - ----- -------------
--------------------
--------------------
-------------------
---
--- ------- ------ ------ - ----- -------------
-----------------
-----------------
----------------
---
------ - ------ ------ ----- --
-在这个例子中，使用 Promise.all 方法并行请求多个数据。当所有数据都准备好时，使用解构语法将 result1、result2 和 result3 解析为 json 方法返回的数据。最后，返回数据的对象。
3. 批量请求
如果需要批量请求 API，将使用 forEach 和 for 循环等控制流语句来访问数组并同时执行异步操作。
----- -------- --------- -
--- ------- - ---
------- ---- -------------- ---- -
--- -------- - ----- ---------------
--- ---- - ----- ----------------
-------------------
-
------ --------
-在这个例子中，使用 for 循环按顺序访问每个 URL 并从服务器拉取数据。这将添加每个结果到结果数组中。
总结
async/await 方法是解决异步编程问题的优秀方法。async 声明函数返回 Promise 对象，可以使用 try...catch 处理错误，同时允许您使用多个异步操作并行运行。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/652dde407d4982a6ebefa2b8