异步编程已经成为现代 Web 开发的必备技能之一。在 JavaScript 中，我们经常使用回调函数或者 Promise 对象来实现异步编程。不过，这些方法都存在一些缺陷，比如回调地狱和 Promise 嵌套等问题。这时，ES7 的 async/await 就成了一种非常好的解决方案。
async/await 的原理
async/await 是 ES7 中新增加的关键字，可以让 JavaScript 函数执行异步操作，同时让代码看起来像同步代码。它的原理其实很简单：async 函数返回一个 Promise 对象，而在这个函数中，await 表达式会暂停函数的执行，等待 Promise 对象 resolve 后继续执行 async 函数。
使用 async/await 的示例
为了更好地理解 async/await，我们可以看一个简单的示例。假设我们需要在函数中异步加载一个 JSON 文件，然后解析成 JavaScript 对象：
-- -------------------- ---- -------
----- -------- ------------- -
--- -------- - ----- ----------- -- ---- ---
-- ---------------- -- ---- -
--- ---- - ----- ---------------- -- -- ---- --
------ -----
- ---- -
----- --- -----------------------
-
-
-----------------------------------------
---------- -- ------------------
------------ -- ----------------------上面的代码中，async 函数 loadJson 在结果上等价于下面的 Promise 函数：
-- -------------------- ---- -------
-------- ------------- -
------ ----------
-------------- -- -
-- ---------------- -- ---- -
------ ----------------
- ---- -
----- --- -----------------------
-
---
-
-----------------------------------------
---------- -- ------------------
------------ -- ----------------------可以看到，使用 async/await 让我们的代码更加简洁明了，同时避免了回调地狱和 Promise 嵌套问题。
async/await 的错误处理
在 async 函数中，使用 try/catch 可以同步地处理异步操作的错误。比如，在上面的示例中，我们可以使用 try/catch 来捕获异常情况：
-- -------------------- ---- -------
----- -------- ------------- -
--- -
--- -------- - ----- -----------
-- ---------------- -- ---- -
--- ---- - ----- ----------------
------ -----
- ---- -
----- --- -----------------------
-
- ----- ------- -
---------------------
-
-
------------------------------------------结论
使用 async/await 可以使代码看起来更加简洁明了，而且可以避免回调地狱和 Promise 嵌套等问题。在实际应用中，我们应该尽可能地使用它来提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6752d4988bd460d3ad99071c