如何在打字稿中使用生成器功能

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方法（這是您在問題中尋找的方法）。 可迭代對象有一個名為Symbol.iterator的屬性（指定一個默認迭代器），這使得它們可以在 for 循環中使用。

因為生成器函數返回一個生成器對象，而生成器對象是一個可迭代的迭代器，所以你必須聲明一個IterableIterator的返回類型。 在您的情況下，它將是IterableIterator<number> 。

因為這里的術語非常相似，所以我錄制了一個解釋差異的生成器教程。 確保您的設定target來es6在tsconfig.json ，使用發電機的功能時。

Answer 4

這是另一個使用 Generator 類型的打字稿的示例。 分配迭代器時的某些類型，例如const iterator: Generator<number>可以省略，因為 TS 可以推斷它們。 但是，為了更加明確，我將它們包含在此示例中。

class GeneratorClass {
    *generator(count:number): Generator<number> {
        while(count < 3)
            yield count++;
    }   
}

const generatorObject = new GeneratorClass();

// Getting our generator object which we can use as an iterator.
const iterator: Generator<number> = generatorObject.generator(1);


console.log(iterator.next());
console.log(iterator.next());
console.log(iterator.next());
/*
[LOG]: {
  "value": 1,
  "done": false
} 
[LOG]: {
  "value": 2,
  "done": false
} 
[LOG]: {
  "value": undefined,
  "done": true
} 
*/

// Alternative more clean for of syntax. 
// For of can iterate over any iterable
// Can be used since every Generator is an Iterator
const iterator2: Generator<number> = generatorObject.generator(1);