使用 async/await 更新 ES6 代码
JavaScript 是一门非常强大的编程语言，不断发展，更新。ES6 是其中的一次更新，带来了许多新特性，比如箭头函数、解构赋值、模板字符串等等。这些新特性让我们的代码更加简洁易懂，并且使得我们的开发效率得到了显著提升。
在 ES6 中，我们还有一种新的语法用来解决异步回调的问题，那就是 async/await。在本文中，我们将会学习如何使用这个语法来优雅地处理异步代码。
什么是 async/await?
async/await 是 ES6 中的一种语法糖，它可以让我们编写异步代码看起来像同步代码一样。它的本质是 Promise，只不过在使用时更加简单明了。
如何使用 async/await?
使用 async/await 的前提条件是，被执行的代码必须返回一个 Promise 对象。我们可以通过 async 关键字来定义一个异步函数，例如：
----- -------- --------- -- - ----- -------- - ----- ------------------ ----- ---- - ----- --------------- ------ ---- -
上面这个例子中，fetchData 是一个异步函数，返回一个 Promise 对象。在函数内部，我们使用了 await 关键字来等待 fetch 返回的 Promise 对象和 response.json() 返回的 Promise 对象完成，然后将结果赋值给变量 response 和 data。
我们也可以使用 try...catch 语句来捕获异常：
----- -------- --------- -- -
--- -
----- -------- - ----- ------------------
----- ---- - ----- ---------------
------ ----
- ----- ------- -
------------------
-
-除了使用 async 关键字定义一个异步函数以外，我们还可以使用箭头函数的方式：
----- --------- - ----- -- -- - ----- -------- - ----- ------------------ ----- ---- - ----- --------------- ------ ---- -
async/await 的好处
使用 async/await 有以下好处：
- 更简洁易懂：与传统的异步回调方式相比，
async/await使得我们的代码更加简洁易懂。 - 函数返回 Promise：使用
async/await定义的函数，返回的类型是Promise对象，方便我们进行异步编程。 - 异常处理：异步函数内部的异常可以通过
try...catch来进行捕获和处理。
示例代码
下面是一个通过 async/await 实现异步操作的例子，实现了一个延迟 1 秒后返回字符串 Hello, World! 的函数。
----- ----- - ----- -- -- -
------ --- --------------- -- -
------------- -- --------------- --------- -----
--
-
----- ----------- - ----- -- -- -
----- ------- - ----- -------
--------------------
-
-------------这段代码中，我们使用 delay 函数模拟一个异步操作（这里使用了 setTimeout 来模拟一个 1 秒的操作），在 showMessage 函数中使用 await 来等待 delay 返回的 Promise 对象完成，并将返回值赋值给 message，然后在控制台输出。
结论
async/await 是 ES6 引入的一种异步编程方式，它可以简化异步代码的编写，让我们的代码更加简洁易懂。使用 async/await 可以让我们编写出优雅的异步代码，提高我们的开发效率。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6739a03b92e7a926093beb5e