第 17 章 Generator 函数的语法

Generator 函数的语法

1. 简介

1
2
3
4
5
6
7
8
9
10
11
12
13
function* helloWorldGenerator() {
yield 'hello';
yield 'world';
return 'ending';
}

let hw = helloWorldGenerator();

hw.next(); // [value: 'hello', done: false]
hw.next(); // [value: 'world', done: false]
hw.next(); // [value: 'ending', done: true]
hw.next(); // [value: undefined, done: true]
// value 属性表示当前的内部状态的值,done 属性是一个布尔值,表示是否遍历结束

2. yield* 表达式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function* foo() {
yield 'a';
yield 'b';
}

function* bar() {
yield 'x';
yield* foo();
yield 'y';
}

// 等同于
function* bar() {
yield 'x';
yield 'a';
yield 'b';
yield 'y';
}

// 任何数据结构只要有 Iterator 接口,就可以被 yield* 遍历

3. 作为对象属性的 Generator 函数

1
2
3
4
5
6
7
8
9
10
11
12
let obj = {
* myGeneratorMethod() {
// ...
}
}

// 等同于
let obj = {
myGeneratorMethod: function* () {
// ...
}
}

4. Generator 与状态机

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// clock 函数是一个状态机
let ticking = true;
let clock = function() {
if (ticking) {
console.log('Tick!');
} else {
console.log('Tock!');
}
ticking = !ticking;
}

// clock 函数的 Generator 实现
let clock = function* () {
while(true) {
console.log('Tick!');
yield;
console.log('Tock!');
yield;
}
}
-------------本文结束 感谢您的阅读-------------
您的支持将鼓励我继续创作!