JavaScript 解析不同类型生成器

众所周知，JavaScript是一种轻量级编程语言，其中的生成器引入自ECMAScript 2015。生成器是一个有多个输出值的过程，并且可以停止和重新启动。在JavaScript中，生成器由生成器函数组成，该函数产生一个可迭代的 Generator 对象。

在本文中，我们将讨论JavaScript中的生成器，并详细介绍不同类型的生成器的语法和示例。

JavaScript中生成器的介绍

生成器函数与普通函数相同，但有一些区别，即生成器函数可以进行暂停和恢复。通常，在JavaScript中，一旦调用函数，它们就不会停止。通常，生成器的概念用于异步编程。

JavaScript中生成器函数的语法

现在我们将讨论JavaScript中生成器函数的语法，并与普通函数进行比较。

使用函数的 * 语法来构建生成器函数，使用 yield 关键字来暂停它们。

function * genFunc() {
   yield 'Hello';
   yield 'World';
}
const g = genFunc(); // g is a generator
g.next(); // { value: 'Hello', done: false }
g.next(); // { value: 'World', done: false }
g.next(); // { value: undefined, done: true }
…

当生成器函数被首次调用时，它的代码不会运行，而是返回一个生成器对象。通过调用生成器的next()方法来消费值，该方法运行代码直到遇到yield关键字，在这一点上暂停并等待下一次调用next()。

在上面的代码中，最后一个语句之后，连续调用g.next()只会产生相同的返回对象：{value: undefined, done: true}，因为在我们的genFunc()函数中在’world’之后没有定义任何内容。

yield关键字暂停生成器函数的执行，并将其后面的表达式的值传递给生成器的调用者。它类似于基于生成器的return关键字的版本。它只能直接从包含yield的生成器函数中调用。

与常规函数的比较

function regFunc() {
   console.log("Hello World");
}
// Hello World

在常规函数中，我们不使用’*’函数，正如你在上面的示例中看到的，它也不使用yield函数。正如我们上面讨论的，常规函数和生成器函数的主要区别在于生成器函数可以被停止和暂停。所以通过上面的示例，你可以看到我们没有选择停止它并直接打印整个语句，即“Hello world”。

既然我们已经了解了生成器函数的基础知识，现在让我们转向不同类型的生成器函数-

普通生成器

在普通生成器中，生成器作为迭代器工作，每次执行next()方法调用生成一个函数后，会生成下一个值。让我们看一个示例，在这个示例中，我们将逐个生成数字，直到列表结束。

function* generator_function(){
   for(var cur = 0 ; cur<7; cur++){
      yield cur;
   }
}
var object_generator = generator_function();
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);

在上面的代码中，我们创建了一个普通的一般函数，其中包含yield关键字，并使用next()函数多次调用它。

带参数的生成器

带参数的生成器与正常的生成器略有不同，这次我们必须使用next()函数传递参数给生成器函数。每次传递参数时，它会在关键字yield之后存储，而不是之前，在接下来的示例中我们将理解这个概念。

function* generator_function(){
   console.log("start of the function")
   temp = yield;
   console.log("This is the first value passed: " + temp)
   temp = yield;
   console.log("This is the second value passed: " + temp)
}
var object_generator = generator_function();
object_generator.next("This is not the first ");
object_generator.next("this is first");
object_generator.next("this is second");
object_generator.next();

在上面的代码中，我们定义了生成器函数，这次我们将参数传递给它。当我们首次调用对象时，给定的参数不会被打印，因为它是在“yield”关键字之前发送的，然后发送的值被存储在变量中并打印出来，而在第二个打印值之后不会发生任何事情，因为没有yield存在。

带有对象属性的生成器

生成器可以用作对象，当我们调用它们时，它们将简单地返回分配给它们的值，并且可以打印出来。为了理解这个概念，让我们看一个示例。

function* generator_function(){
   yield "First value"
   yield "Second value"
   yield "Third value"
}
var object_generator = generator_function();
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);

在上面的代码中，首先，我们定义了三个yield表达式，后面跟着一个字符串，当调用生成器时，这些yield表达式后面的字符串将被返回。

还有其他类型的生成器，如带有返回类型的生成器和包含另一个生成器的生成器等。