在 JavaScript 中，异步编程一直都是一个重要的话题。以前我们通过使用回调函数来解决异步问题，但这样会造成“回调地狱”的问题。随着 ES7 的发布，async/await 成为了处理异步任务的更好的选择。它可以使代码更加可读性和易于维护。
什么是 async/await？
async/await 是一种新的方法来处理异步操作，其本质上只是 Generator 函数语法糖的简化版。async 函数标记为异步函数，表示它返回的是一个 Promise 对象，而 await 表达式则会暂停当前异步代码的执行，等待 Promise 对象 resolve/reject 并返回结果。
----- -------- ------- - ------ ------- -------- - ------------------- -- --------------------- -- ------- ------- -------
这里的 hello() 返回的是一个 Promise 对象，因此我们可以使用 .then() 方法来获取返回值。
----- -------- ------------------ -
-- ---- - - -- --- - ---- -
----- --- ------------- --- -- ---------
-
------ ----
-
------ ---------- -
--- -
----- ------- - ----- ------------------
--------------------- -- ------- --
----- ------- - ----- ------------------
-- --- ---- --------- ----- -- ----- ----- ---
- ----- ------- -
--------------------------- -- ------- ------- --- -- -------
-
-----在上述代码中，numberInRange() 函数用于检查一个数字是否介于 0 和 100 之间。如果不是，则抛出一个错误。接着我们调用该函数两次：第一次参数为 50，返回正确；而第二次参数为 -1，抛出错误，然后跳到 catch 块。
为何要使用 async/await？
使用 async/await 的好处有：
- 清晰的异步流程：使用 async/await 可以使异步流程更加易于阅读和维护，避免回调函数造成的代码混乱。
- 更少的错误处理：使用
try/catch块可以轻松处理异步错误，并且它们的语法结构比传统的错误回调更加直观。 - 翻译已有代码：之前的基于 Promise 的异步代码可以通过 async/await 重写为更容易理解的形式。
使用 async/await 的注意事项
虽然 async/await 看起来非常方便，但也要注意一些坑点：
- 在一个 async/await 函数内部使用 return 语句会导致 Promise 对象被 resolve，并且 resolve 的值就是返回的参数值。
- 自动捕获异常：当 await 表达式抛出异常时，整个表达式会被包装为一个被 reject 的 Promise 对象，并且异常信息将自动传递到被 reject 的 Promise 中。
- 多个 await 表达式并行执行：如果多个 await 表达式不互相依赖，可以在一个 async 函数中使用它们来并行地发起一些异步请求。
----- -------- ------------ -
--- -
----- ------- ------ - ----- -------------
--------------------------------- -- -----------------
--------------------------------- -- ----------------
---
------------------ -------
- ----- ------- -
------------------ -------- ----- -- ------- -------
-
-结论
async/await 是一种新的处理异步操作的方法，在使用时要注意一些细节。它具有非常好的可读性、易维护性以及清晰的异步流程结构，是值得学习掌握的技术。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/672d6883ddd3a70eb6da4ebb