在 ES6 中，引入了生成器函数（Generator Function），它是一种特殊的函数，可以通过 yield 关键字暂停函数的执行，并在需要的时候恢复执行。本文将详细介绍生成器函数的特性、语法和用法，并提供一些示例代码。
生成器函数的基本语法
生成器函数的声明方式与普通函数相同，只是在函数名前添加一个 * 符号。例如：
function* myGenerator() {
// generator function body
}生成器函数内部可以使用 yield 关键字来暂停函数的执行，并返回一个值。例如：
function* myGenerator() {
yield 1;
yield 2;
yield 3;
}上面的代码定义了一个生成器函数 myGenerator，它会依次返回值 1、2、3。注意，每次调用 yield 关键字时，函数的执行会被暂停，并将 yield 后面的值作为返回值。
使用生成器函数
生成器函数可以像普通函数一样被调用，但是它不会立即执行，而是返回一个迭代器（Iterator）对象。通过这个迭代器对象，可以依次获取生成器函数返回的值。
-- -------------------- ---- ------- --------- ------------- - ----- -- ----- -- ----- -- - ----- -------- - -------------- ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ ---------- ----- ---- -
上面的代码中，我们首先定义了一个生成器函数 myGenerator，然后通过调用该函数，得到一个迭代器对象 iterator。接着，我们通过调用迭代器对象的 next() 方法，依次获取生成器函数返回的值。注意，当生成器函数没有更多的值可以返回时，done 属性会变为 true，同时 value 属性的值为 undefined。
生成器函数的特性
生成器函数有以下几个特性：
1. 可以暂停函数的执行
生成器函数可以通过 yield 关键字暂停函数的执行，并返回一个值。这个值可以被调用者获取并使用。
2. 可以恢复函数的执行
当生成器函数被调用者恢复执行时，函数的执行会从上一次暂停的位置继续执行，直到遇到下一个 yield 关键字或函数结束。
3. 可以生成无限的值
生成器函数可以生成无限的值，因为它可以在需要时动态生成值，并且不需要一次性生成所有的值。
4. 可以接受参数
生成器函数可以接受参数，并根据参数生成不同的值。例如：
-- -------------------- ---- -------
--------- ------------------ ---- -
--- ---- - - ------ - -- ---- ---- -
----- --
-
-
----- -------- - -------------- ---
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ ---------- ----- ---- -上面的代码中，我们定义了一个生成器函数 myGenerator，它接受两个参数 start 和 end，根据这两个参数生成一系列的数字。接着，我们通过调用该函数并传入参数，得到一个迭代器对象 iterator，并依次获取生成器函数返回的值。
生成器函数的应用场景
生成器函数在实际开发中有很多应用场景，例如：
1. 生成器函数和 Promise 结合使用
生成器函数可以和 Promise 结合使用，实现异步操作的流程控制。例如：
-- -------------------- ---- -------
--------- ------------- -
----- ------- - ----- --------------------------------------
----- ------- - ----- --------------------------------------
------ --------- ---------
-
----- -------- - --------------
---------------------------------- -- -
----------------------------------------- -- -
-----------------------
---
---上面的代码中，我们定义了一个生成器函数 myGenerator，它依次获取两个异步操作的结果，并返回一个数组。接着，我们通过调用该函数，得到一个迭代器对象 iterator，并通过 next() 方法获取生成器函数的执行结果。注意，当调用 next() 方法时，我们需要将上一次异步操作的结果传入，以便生成器函数继续执行。
2. 生成器函数和 for...of 循环结合使用
生成器函数可以和 for...of 循环结合使用，实现迭代器对象的自定义。例如：
-- -------------------- ---- ------- --------- ------------- - ----- -- ----- -- ----- -- - --- ------ ----- -- -------------- - ------------------- -
上面的代码中，我们定义了一个生成器函数 myGenerator，它依次返回值 1、2、3。接着，我们通过 for...of 循环遍历生成器函数返回的迭代器对象，并依次输出每一个值。
总结
生成器函数是 ES6 中的一个重要特性，它可以暂停函数的执行，并在需要的时候恢复执行。通过生成器函数，我们可以方便地生成无限的值，并实现异步操作的流程控制。因此，在实际开发中，我们应该充分利用生成器函数的特性和语法，提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65d16ec4add4f0e0ffa1f1e2