异步编程在前端开发中扮演着重要的角色，然而异步编程的代码结构往往复杂难懂，因此，ES9中引入了async/await语法，它能够使异步任务的执行过程更加清晰明了，使得开发者更加容易理解和维护代码。
async/await 是什么？
async/await是ES9新增的异步编程语法糖，它基于Promise实现，用于解决回调地狱的问题，通过让异步任务的执行过程更像同步代码的执行，以达到更好的可读性。
async/await 的使用
async/await是通过async函数实现的。async函数是一个返回Promise对象的函数，可以使用await关键字来等待一个Promise对象的执行结果，并返回执行结果的value，如果Promise对象抛出异常则会被async函数捕获。
下面是一个简单的例子，演示了async/await的使用方式：
-- -------------------- ---- -------
----- -------- --- -- -
---------------- -------
----- ------ - ----- -----------
---------------- -----
------ ------
-
-------- ----------- -
------ --- --------------- -- -
------------- -- -
---------------
-- -----
--
-
--------------- -- -
-----------------
--在上面的代码中，console.log('foo start')会第一时间被执行，await fetchData() 返回的promise对象仅仅只是进行异步操作，不会阻塞后续代码的执行，此时会直接跳过等待 async函数，进入console.log('foo end')，等待await fetchData()的执行结果，执行结束后才会执行 async 的 then 方法。
async/await 的优点
- 代码结构清晰明了：async/await是基于Promise实现，通过让异步任务的执行过程更像同步代码的执行，以达到更好的可读性。
- 灵活性：async/await可以与Promise一起使用，也可以单独使用，可以根据需求选择最合适的方法来实现同步执行异步任务。
- 错误处理：使用了 try...catch 语句，异步任务除了通过 Promise 返回错误时，也可以在内部使用 throw 抛出错误。
async/await 的缺点
- 某些情况下失去了异步并发的能力：await关键字会阻塞后面的代码执行，从而获得异步结果，所以在某些情况下使用async/await会使异步请求的执行效率低于使用回调函数或者Promise。
使用建议
虽然它们是相对独立的两个特性，但 async/await 很好地兼容 Promises，并且在使用过程中效率更高。那么，它们的兼用方式是怎样的呢？
- 使用 async/await 管理 promise
-- -------------------- ---- ------- ----- -------- ------- -- - ----- -------- - ----- ----------------------------------- ----- ---- - ----- --------------- ------ ---- - --------------------- -- - ----------------- ---------------- -- - ------------------ --
- Promises执行异步操作速度较慢时，使用 async/await 最好的办法是需要的并发
-- -------------------- ---- -------
----- -------- ---------- -
----- ------- ------- - ----- -------------
----------------
----------------
--
------ - ------ ------ -
-
---------------------- -- -
-----------------
---------------- -- -
------------------
--总结
使用async/await可以让我们在开发过程中更加专注于代码逻辑，代码结构清晰明了，这是它最大的优点，使得我们的异步编程代码显得更加简单易懂。然而在某些特殊情况下，async/await可能会影响异步并发的效率，所以在具体使用的时候，谨慎考虑是非常必要的。
参考资料
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64d030bdb5eee0b52572bf1a