ES7 是 JavaScript 的一个版本,其中引入了一种新的关键字 async
和 yield
,这两个关键字可以用来简化异步 generator 代码。本文将会介绍 async
和 yield
的作用机制和使用方法,并给出实际的代码示例。
简介
在 ES7 中,async
和 yield
关键字是为了改善异步代码的写法而设计的。异步代码本质上是回调函数,而回调函数的写法往往会导致代码不易阅读和维护。async
和 yield
的设计是为了让异步代码更直观且易读。
async
async
是一个关键字,用于定义异步函数。在定义时,可以将它作为函数修饰符使用,即放在函数的前面,如下所示:
async function f() { return 1; }
异步函数有以下的特点:
- 异步函数总是返回一个 Promise 对象;
- 在异步函数中,可以使用
await
关键字来等待一个异步操作完成; await
的返回值是异步操作的结果。
下面是一个简单的 async
函数的例子:
-- -------------------- ---- ------- ----- -------- ----------- - --- ------ - ----- -------------------------------------------- --- ---- - ----- -------------- ------ ----- - -------------------------- -- - ------------------ ---
在这个例子中,我们定义了一个 getData
函数,该函数使用 await
关键字在异步地请求数据。当 getData
函数完成时,会返回 JSON 数据,然后通过 then
方法来处理数据。
需要注意的是,当一个函数被声明为 async
时,它内部的所有代码都会自动包装在一个 Promise 对象中。如果函数中没有使用 await
,则 Promise 立即解决并返回函数的值。
yield
yield
关键字可以用于定义 generator 函数。generator 函数是 ES6 中的一个新特性,其可以在函数执行中暂停和恢复。yield
关键字会返回保存执行状态的一个对象,该对象包含着当前函数的执行状态和下一步要执行的代码。
下面是一个 generator 函数的示例代码:
-- -------------------- ---- ------- --------- ----- - ---------------------- ----- -- ----------------------- ----- -- -------------------- - ----- --------------- - ------ ------------------------------------ -- - ------ -- ----- ----- - ------------------------------------ -- - ------ -- ----- ----- - ------------------------------------ -- - ------ ---------- ----- ---- -
在这个代码中,我们定义了一个 generator 函数 foo,它可以使用 yield
来控制执行顺序。我们创建了一个 generator 对象 generatorObject
,并通过 next
方法进一步执行。
需要注意的是,每次调用 console.log(generatorObject.next())
都会执行一个 yield
语句。
async
和 yield
配合使用
当 async
和 yield
联合使用时,async
语法可以让我们在执行异步函数时更加方便,而 yield
则可以控制程序的执行顺序,改善异步代码的写法。下面是这两个关键字一起使用的示例:
-- -------------------- ---- ------- ----- -------- ------------- - ----- -------- - ----- ------------------------------------------- ----- ---- - ----- ---------------- ------ ----- - ----- --------------- - ------------ -------------------------------------- -- - ------------------ ---
在这个代码中,我们定义了一个 fetchUser
函数,它首先使用 await
关键字异步地请求数据,然后通过 yield
完成数据的转换。在这个例子中,我们创建了一个 generatorObject
,并使用其下一个值的 { value,done }
中的 value
属性执行第一次异步操作。
结论
ES7 中的 async
和 yield
关键字可以使我们更加轻松地编写和维护异步功能。通过 async
和 yield
的配合,我们可以更好地控制程序的执行顺序,更加清晰地阅读代码。同时,这些关键字还可以简化异步代码,使得代码风格更加清晰。
关于更多的 ES7 更新和 JavaScript 编程技巧,可以在阮一峰的个人博客中找到。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/674d477ca336082f254b73df