随着 JavaScript 语言的发展，异步编程方式愈发重要。ES8 引入了异步函数，这是一个新的标准来简化异步编程的复杂性。异步函数是基于 JavaScript 的 Promise API 构建和设计的，可以让我们编写更加简单和易于维护的异步代码。在这篇文章中，我们将深入探讨 ES8 中的异步函数。
异步函数是什么？
异步函数是指可以包含 await 表达式的函数。这种函数执行时，通常会返回一个 Promise 实例。用异步函数可以写出像同步代码一样易于阅读和理解的异步操作。
如何使用异步函数？
首先，我们需要在函数前面添加 async 关键字表示该函数是异步的。然后，我们可以在函数中使用 await 表达式来等待必要的异步操作完成后，再继续执行后续的代码。
在下面的例子中，我们定义了一个简单的异步函数，通过 await 表达式等待 Promise 执行完毕并返回结果：
async function fetchUserData(userId) {
const response = await fetch(`https://jsonplaceholder.typicode.com/users/${userId}`);
const user = await response.json();
return user;
}
fetchUserData(1).then(user => console.log(user)); // { id: 1, name: 'Leanne Graham', email: ... }在上面的代码片段中，我们定义了一个名为 fetchUserData 的异步函数，它接收一个参数 userId。在函数体内，我们使用 fetch 函数发送一次网络请求，该函数返回一个 Promise 对象。接着，我们使用 await 表达式等待 Promise 对象解决并把结果存储在 response 变量中。然后，我们调用 response.json() 方法来处理响应数据，并把结果存储在 user 变量中。最后，我们返回 user 变量的值。
我们可以使用 fetchUserData 函数来获取 ID 为 1 的用户数据，并在控制台上打印它。在调用 fetchUserData 函数时，它返回一个 Promise，我们可以使用 then 方法来打印结果。
异步函数的错误处理
异步函数的错误处理机制和 Promise 的错误处理机制非常相似。如果异步函数是通过抛出错误来报告错误的，则可以使用 try / catch 语句来进行错误处理。
在下面的例子中，我们为 fetchUserData 函数添加了一个 try / catch 块，以处理任何可能出现的错误：
-- -------------------- ---- -------
----- -------- --------------------- -
--- -
----- -------- - ----- --------------------------------------------------------------
----- ---- - ----- ----------------
------ -----
- ----- ------- -
---------------------
------ -----
-
-
--------------------------- -- ------------------- -- ----在上面的代码片段中，我们为 fetchUserData 函数添加了一个 try / catch 块。如果 fetch 函数返回一个带有错误状态码的响应，那么 response.json() 方法就会抛出一个错误。在 catch 块中，我们打印错误信息，并返回 null 值。
对比 Promise 和异步函数
在 JavaScript 中，Promise 是一种非常流行和广泛使用的异步编程模式。但是，异步函数同样很强大且易于使用。在下面的例子中，我们可以看到两种差异大致的代码：
Promise：
-- -------------------- ---- -------
-------- --------------------- -
------ -------------------------------------------------------------
-------------- -- -
-- -------------- -
----- --- -------------- ------ ---------------------
-
------ ----------------
--
------------ -- -
---------------------
------ -----
---
-
-------------------------- -- -------------------异步函数：
-- -------------------- ---- -------
----- -------- --------------------- -
--- -
----- -------- - ----- --------------------------------------------------------------
-- -------------- -
----- --- -------------- ------ ---------------------
-
------ ----------------
- ----- ------- -
---------------------
------ -----
-
-
-------------------------- -- -------------------在上面的代码片段中，我们可以看到 Promise 和异步函数之间的差异。在 Promise 中，我们将 Promise 实例的回调函数传递给 then 和 catch 方法来编写异步代码并处理错误。而在异步函数中，我们使用 async 和 await 关键字来等待 Promise 解决并执行后续的代码，同时我们也可以使用 try / catch 语句来处理错误。
总结
异步函数是 ES8 中的一个新特性，可以帮助我们更好地处理异步操作。我们可以使用 async 和 await 关键字来等待 Promise 解决并执行后续的代码，同时可以使用 try / catch 语句来处理错误。与 Promise 不同，异步函数提供了一种更加易于使用和阅读的方式来编写异步操作。在实际开发中，我们可以根据情况选择使用 Promise 或异步函数。如果你正在开发较复杂的异步操作，那么异步函数绝对是一个强大的工具。
参考文献
- ES8 中的异步函数，访问日期:2021-09-28，地址：https://www.smashingmagazine.com/2018/07/async-await-api-javascript/
- Understanding async/await in JavaScript，访问日期:2021-09-28，地址：https://codeburst.io/understanding-async-await-in-javascript-1d111f40c5ff
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/645a141a968c7c53b0c32b9c