怎么理解es6中的Generator的？使用场景有哪些？

怎么理解es6中的Generator的？使用场景有哪些？

引用

CSDN

1.

https://blog.csdn.net/weixin_42811248/article/details/140953957

ES6中的Generator是一种特殊的函数，它允许函数在执行过程中暂停和恢复，从而实现更灵活的控制流。Generator函数使用function*定义，并且通过yield关键字来暂停执行，通过next()方法来恢复执行。

理解Generator

1. 定义：

function* generatorFunction() {
  yield 1;
  yield 2;
  yield 3;
}

2. 执行：

const gen = generatorFunction();
console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3

3. 暂停和恢复：

• yield关键字使函数暂停执行，并返回一个值。
• next()方法恢复函数执行，并可以传递一个参数，该参数会成为yield表达式的返回值。

使用场景

1. 异步编程：

• Generator可以用来处理异步操作，比如文件读取、网络请求等。通过yield暂停执行，等待异步操作完成后再继续执行。

function* fetchData() {
  const data = yield fetch('https://api.example.com/data');
  console.log(data);
}
const gen = fetchData();
gen.next().value.then(response => {
  response.json().then(data => {
    gen.next(data);
  });
});

2. 状态机：

• Generator可以用来实现状态机，通过yield和next()来控制状态转换。

function* stateMachine() {
  let state = 'A';
  while (true) {
    if (state === 'A') {
      state = yield 'A';
    } else if (state === 'B') {
      state = yield 'B';
    }
  }
}
const sm = stateMachine();
console.log(sm.next().value); // 'A'
console.log(sm.next('B').value); // 'B'
console.log(sm.next('A').value); // 'A'

3. 迭代器：

• Generator可以用来实现自定义迭代器，通过yield返回值，next()方法控制迭代过程。

function* range(start, end) {
  for (let i = start; i <= end; i++) {
    yield i;
  }
}
const iterator = range(1, 5);
for (let value of iterator) {
  console.log(value); // 1, 2, 3, 4, 5
}

4. 协程：

• Generator可以用来实现协程，通过yield和next()来控制多个函数之间的协作。

function* foo() {
  console.log('foo start');
  yield 'foo yield';
  console.log('foo end');
}
function* bar() {
  console.log('bar start');
  const fooResult = yield* foo();
  console.log('bar continue', fooResult);
  console.log('bar end');
}
const gen = bar();
console.log(gen.next().value); // 'foo start'
console.log(gen.next().value); // 'foo yield'
console.log(gen.next().value); // 'bar continue foo yield'
console.log(gen.next().value); // 'bar end'

总结

Generator函数提供了一种强大的方式来控制函数的执行流程，适用于异步编程、状态机、迭代器和协程等多种场景。通过yield和next()方法，可以灵活地暂停和恢复函数执行，从而实现更复杂和灵活的控制流。