深入理解JS Generator数据类型

什么是Generator？

Generator是ES6引入的一种新的数据类型，它可以被认为是一种特殊的函数。Generator函数和普通函数的区别在于：

1. Generator函数的执行结果是一个Iterator对象，而不是最终的返回值。
2. Generator函数可以通过yield语句来暂停或恢复函数的执行。

Generator函数的定义方式

Generator函数的定义方式与普通函数相同，不同的是要在function关键字后面加一个星号（*）。

下面是一个简单的例子：

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

const generatorObj = myGenerator();
console.log(generatorObj.next()); // {value: 1, done: false}
console.log(generatorObj.next()); // {value: 2, done: false}
console.log(generatorObj.next()); // {value: 3, done: false}
console.log(generatorObj.next()); // {value: undefined, done: true}

yield语句和next()方法

Generator函数内部可以使用yield语句暂停函数的执行，并返回一个值给调用方。Generator对象有一个next()方法，用于继续执行函数。当函数再次执行到yield语句时，函数再次暂停执行，next()方法会返回yield后面的值。

下面是一个简单的例子：

function* myGenerator() {
  let count = 0;
  while (true) {
    yield count++;
  }
}

const generatorObj = myGenerator();
console.log(generatorObj.next()); // {value: 0, done: false}
console.log(generatorObj.next()); // {value: 1, done: false}
console.log(generatorObj.next()); // {value: 2, done: false}
console.log(generatorObj.next()); // {value: 3, done: false}

Generator函数和Promise结合使用

Generator函数可以和Promise结合使用，实现异步编程。在Generator函数内部通过yield语句返回Promise对象的结果，然后使用Generator对象的next()方法继续执行Generator函数。

下面是一个简单的例子：

function* myGenerator() {
  const result = yield fetch('https://jsonplaceholder.typicode.com/todos/1');
  console.log(result);
}

const generatorObj = myGenerator();
const promise = generatorObj.next().value;
promise.then(response => response.json())
  .then(data => generatorObj.next(data));

总结

通过上述示例，我们对JS Generator数据类型有了更深入的了解。Generator函数的定义方式、yield语句和next()方法是掌握Generator的关键。在实际开发中，结合Promise和Generator可以实现更加灵活的异步编程。