解释 JavaScript 中不同类型的生成器

PHPz 转载: 2023-09-01 13:33:14 652浏览

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

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

JavaScript 中的生成器简介

生成器的功能与常规功能相同，但有一点不同，生成器功能可以恢复和暂停。一般来说，在 JavaScript 中，函数一旦被调用就不会停止。通常，生成器的概念出现在异步编程中。

JavaScript 中生成器函数的语法

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

function * 语法用于构建生成器函数，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, did: true}，因为我们在我们的代码中的 'world' 之后没有定义任何东西。 genFunc() 函数。

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”关键字之前发送的，然后在发送的值存储在变量中并打印之后，在第二次打印值之后，不会发生任何事情，因为没有产量目前。

具有对象属性的生成器

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

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表达式，它们后面有一个字符串，当我们调用生成器时，它们后面的字符串将被返回。

还存在其他类型的生成器，例如返回类型，有些生成器内部包含另一个生成器，等等。