生成器是否同时返回迭代器和可迭代对象？

From 这个问题我之前问过 https://stackoverflow.com/questions/50917742/can-i-make-an-iterator-with-a-simple-function-no-generator-or-symbol-iterator我了解到for...of期望一个可迭代的，即

一个实现了@@iterable方法，这意味着该对象（或其原型链上的对象之一）必须具有一个带有@@iterator密钥可通过常量获得Symbol.iterator

所以，一个可迭代的看起来像这样：

const iterableObject: {
  [Symbol.iterator]: function someIteratorFunction() {
    //...
  }
}

另一方面，我们有生成器，如下所示：

function* generatorFoo(){
  yield 1;
  yield 2;
  yield 3;
  yield 4;
}

并且可以用在for...of构造如下：

for(const item of generatorFoo())
  console.log(item);

所以，打电话generatorFoo()返回一个可迭代对象for...of处理它没有问题。我也可以打电话generatorFoo()[Symbol.iterator]()并接收一个迭代器，以确认这一点。

然而，调用generatorFoo还会返回一个迭代器，因为我可以调用generatorFoo()我得到一个带有方法的对象next获取迭代器的下一个值，如下所示：

const iteratorFromGen = generatorFoo();
iteratorFromGen.next().value; //1
iteratorFromGen.next().value; //2
iteratorFromGen.next().value; //3
iteratorFromGen.next().value; //4

这是否意味着调用生成器函数会返回一个可以访问next method and a [Symbol.iterator]方法？

当调用生成器函数时，我们是否得到一个既是迭代器又是可迭代对象的对象？这是如何实现的？

简而言之，是的，生成器既是可迭代对象，又是迭代器。

From MDN https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Generator:

Generator 对象由生成器函数返回，它 同时符合可迭代协议和迭代器协议。

通过调用返回的迭代器Symbol.iterator返回的生成器对象的方法与生成器对象本身相同。例如：

function* gen() {
  let i = 0;
  while (i < 10) yield i++;
}

const iterableIterator = gen();
console.log(iterableIterator === iterableIterator[Symbol.iterator]()); // true

您甚至可以通过遵守迭代器协议并拥有一个Symbol.iterator返回的方法this。例如：

class MyIterableIterator {
  
  constructor(arr) {
    this.arr = arr;
    this.i = 0;
  }

  [Symbol.iterator]() {
    return this;
  }
  
  next() {
    if (this.i === this.arr.length) return {done: true}
    return {value: this.arr[this.i++], done: false}
  }
}

const iterableIterator = new MyIterableIterator([1, 2, 3, 4, 5]);
console.log(iterableIterator === iterableIterator[Symbol.iterator]()); // true

// Works fine if you call next manually, or using a for-of loop.
console.log(iterableIterator.next())
for (let item of iterableIterator) {
  console.log(item);
}