概述
ES8 是 ECMAScript 的第 8 个版本,它在 Async 函数与 await 表达式上做出了显著的改进。Async 函数是一种基于 Promise 的语法糖,能够使异步代码更加易读、易写。Await 表达式则是 Async 函数中的一种关键字,能够让 JavaScript 停止执行,直到一个 Promise 被 resolve 或 reject,从而在代码中处理异步控制流。
Async 函数
Async 函数在语法上类似于 Generator 函数,使用 async 关键字来声明。Async 函数自动返回一个 Promise 对象,并且能够在函数中使用 await 表达式来等待 Promise 对象的解决或拒绝。
下面是一个示例 Async 函数:
----- -------- --------- - ----- -------- - ----- ---------------------------------------------------- ----- ---- - ----- ---------------- ------ ----- -
在这个示例中,我们使用了 fetch 函数来异步获取一个远程 JSON 文件,并使用 await 语法等待 Promise 对象的解决。注意,我们可以在 Async 函数中使用 return 语句来返回 Promise 对象的值,这将在 Promise 对象解决时执行。
我们也可以使用 Promise.all 函数来同时运行多个 Async 函数:
----- -------- ----------- - ----- ------- ------ - ----- ------------------------ ------------- ------------------ ------- - ----- -------- ---------- - ----- -------- - ----- ---------------------------------------------------- ----- ---- - ----- ---------------- ------ ----- - ----- -------- ---------- - ----- -------- - ----- ---------------------------------------------------- ----- ---- - ----- ---------------- ------ ----- -
在这个示例中,我们使用 Promise.all 函数来同时并发获取多个远程 JSON 文件,并分别等待它们解决。
Await 表达式
Await 表达式出现在 Async 函数中,用于等待一个 Promise 对象的结果。当 Await 表达式出现时,JavaScript 执行中断,直到 Promise 对象被解决或拒绝,然后继续执行后面的代码。
下面是一个简单的示例,演示了 Await 表达式的作用:
----- -------- --------- - ----- ----------- - --- ----------------- -- - ------------- -- - ------------- ------ -- ------ --- ----- ---- - ----- ------------ ------------------ ------ ----- - ----------
在这个示例中,我们使用 Promise 延迟 2 秒钟以模拟异步请求,随后我们等待 Promise 对象完成,并打印输出结果。
结论
Async 函数和 Await 表达式提供了一种更加简洁易读的方式来处理异步流程,并能够使代码更加易于维护。虽然它们是相对新的语言特性,但它们已经广泛被支持,并且在现代 JavaScript 和 Web 开发中已经变得日益重要。学习使用 Async 函数和 Await 表达式是每个现代前端开发人员必须掌握的基本技能。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/6721ed662e7021665e096df0