如何在打字稿中使用生成器函数

Question

我试图在打字稿中使用生成器函数.但编译器会抛出错误

error TS2339: Property 'next' does not exist on type

下面是我最接近的代码示例.

export default class GeneratorClass {
    constructor() {
        this.generator(10);
        this.generator.next();
    }
    *generator(count:number): Iterable<number | undefined> {
        while(true)
            yield count++;
    }   
}

这是同一个游乐场的链接

Answer 1

该next方法存在于函数返回的生成器上,而不是生成器函数本身.

export default class GeneratorClass {
    constructor() {
        const iterator = this.generator(10);
        iterator.next();
    }
    *generator(count:number): IterableIterator<number> {
        while(true)
            yield count++;
    }   
}

Answer 2

我看到这个错误是因为我的tsconfig.json是针对es5.

我只是从以下内容更改（摘录）：

"target": "es5",
"lib": [
    "es5",
    "es2015.promise"
]

到：

"target": "es6",
"lib": [
    "es6"
]

错误消失了。

注意：对于 VS Code，我需要重新加载 IntelliSense 窗口以识别更改。

Answer 3

要解决这个问题，了解生成器函数（简称生成器）及其返回值的区别非常重要。

甲发生器函数（由星号标记）是一个函数，它返回一个发电机对象。生成器对象满足迭代器和可迭代对象的要求。

迭代器有一个next方法（这是您在问题中寻找的方法）。和iterables有一个名为属性Symbol.iterator（指定一个默认的迭代器），这使得它们在for循环使用。

因为生成器函数返回生成器对象，生成器对象是可迭代的迭代器，所以必须声明返回类型为IterableIterator。在您的情况下，它将是IterableIterator<number>.

因为这里的术语非常相似，所以我录制了一个解释差异的生成器教程。请务必设置您target要es6在你的tsconfig.json，当使用发电机的功能。