Generators are a powerful feature in JavaScript that allow you to pause and resume the execution of a function, yielding values at specific points. This guide will help you understand how to use generators effectively in your code.

Basic Usage

To create a generator, you define a function using the function* syntax. Inside the generator function, you use the yield keyword to pause the execution and return a value.

function* generatorFunction() {
  yield 'First';
  yield 'Second';
  yield 'Third';
}

const gen = generatorFunction();

console.log(gen.next().value); // 'First'
console.log(gen.next().value); // 'Second'
console.log(gen.next().value); // 'Third'

Yielding Values

Generators can yield values at any point during their execution. This is useful for creating iterators that can be paused and resumed.

function* numberGenerator() {
  for (let i = 0; i < 5; i++) {
    yield i;
  }
}

const gen = numberGenerator();

console.log(gen.next().value); // 0
console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3
console.log(gen.next().value); // 4

Returning from Generators

You can return a value from a generator using the return statement. When the return statement is executed, the generator function stops executing and returns the specified value.

function* generatorFunction() {
  yield 'First';
  yield 'Second';
  return 'Third';
}

const gen = generatorFunction();

console.log(gen.next().value); // 'First'
console.log(gen.next().value); // 'Second'
console.log(gen.next().value); // 'Third'

Using Generators with Async/Await

Generators can be used with async/await syntax to handle asynchronous operations in a synchronous-like manner.

async function* asyncGenerator() {
  const data = await fetchData();
  for (let item of data) {
    yield item;
  }
}

async function processItems() {
  for await (let item of asyncGenerator()) {
    console.log(item);
  }
}

processItems();

async_generator

For more information on generators and their usage, check out our Advanced Generators Guide.

# 生成器指南

生成器是 JavaScript 中的一个强大特性,允许你在函数执行过程中暂停和恢复执行,在特定点返回值。本指南将帮助您了解如何有效地使用生成器。

## 基本用法

要创建一个生成器,您可以使用 `function*` 语法定义一个函数。在生成器函数内部,您使用 `yield` 关键字来暂停执行并返回一个值。

```javascript
function* generatorFunction() {
  yield 'First';
  yield 'Second';
  yield 'Third';
}

const gen = generatorFunction();

console.log(gen.next().value); // 'First'
console.log(gen.next().value); // 'Second'
console.log(gen.next().value); // 'Third'

返回值

生成器可以在执行过程中的任何点返回值。这对于创建可以暂停和恢复的迭代器非常有用。

function* numberGenerator() {
  for (let i = 0; i < 5; i++) {
    yield i;
  }
}

const gen = numberGenerator();

console.log(gen.next().value); // 0
console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3
console.log(gen.next().value); // 4

从生成器返回

您可以使用 return 语句从生成器返回一个值。当执行 return 语句时,生成器函数停止执行并返回指定的值。

function* generatorFunction() {
  yield 'First';
  yield 'Second';
  return 'Third';
}

const gen = generatorFunction();

console.log(gen.next().value); // 'First'
console.log(gen.next().value); // 'Second'
console.log(gen.next().value); // 'Third'

与异步/等待一起使用生成器

生成器可以与 async/await 语法一起使用,以同步的方式处理异步操作。

async function* asyncGenerator() {
  const data = await fetchData();
  for (let item of data) {
    yield item;
  }
}

async function processItems() {
  for await (let item of asyncGenerator()) {
    console.log(item);
  }
}

processItems();

async_generator

有关生成器和它们的使用方法的更多信息,请参阅我们的高级生成器指南