Generator 总览:
- 从语法角度上看,Generator 函数属于一个状态机,内部包含了多个状态;
- 从执行结果看,Generator 函数返回一个遍历器对象,这个对象可以依次遍历Generator 函数内部的每一个状态;
- 从形式上看,Generator 函数是一个普通函数,只是在function 和函数名之间有个星号
*
并且函数内部有yield
来定义不同的状态; - 调用Generator 函数返回的遍历器对象,代表着Generator 函数内部的指针,每次遍历器对象调用
next()
方法,指针由当前状态改为指向下一个状态,而且会返回一个对象(有着value,done连个属性),value属性代表当前状态的值(也就是yield
后面的值),done 属性是个布尔值(true 则表示遍历结束);
上实例:
function* testGen () {
//三个yield + 一个return,就有四个状态
yield 1+2;
yiled 'hello world';
yiled 'this is a';
return 'Generator function test';
}
let test = testGen();
test.next(); // {value:3 , done: false}
test.next(); // {value: 'hello world', done: false}
test.next(); // {value: 'this is a', done: false}
test.next(); // {value: 'Generator function test', done: true} 遍历到这里就结束了
test.next(); // {value: undefined, done: true}
1、Generator 函数返回的遍历器对象和 Iterator 接口的关系
Generator 函数返回的遍历器对象有个属性方法叫 Symbol.iterator
,而前面的在 Iterator 那一篇文章说过,一个对象只要有 Symbol.iterator
方法,就可以调用该方法来生成一个遍历器对象;
Generator 函数就是遍历器生成函数,所以直接给一个对象的Symbol.iterator
赋值,该对象就有了Iterator 接口;
我们来试试给一个对象加一个 Iterator 接口:
let testGen = function* () {
yield 1;
yiled 2;
yiled 3;
};
let testIteratorObj = { };
testIteratorObj[Symbol.iterator] = testGen;
//testIteratorObj 对象就有了Iterator 接口
[...testIteratorObj ] //[1,2,3]
//另外,Generator 函数执行之后返回的遍历器对象的 Symbol.iterator 属性方法执行的结果,等于遍历器对象本身
let g = testGen();
console.log( g[Symbol.iterator]() === g ); //true