Generator函数的用途:
Generator函数是ES6引入的,主要是用于异步编程。最大的特点是可以交出函数的执行权(即暂停执行)。
Generator函数可以通过next方法,去分阶段的注入数据,让函数分阶段的给出不同的返回值。
Generator函数和普通函数的区别:
主要有两个不同。
- function关键字与函数名之间有一个星号,不同于普通函数,是可以暂停执行的,所以函数名之前要加星号,以示区别。
- Generator函数体内使用yield语句,可以定义不同的内部状态。
yield命令是异步不同阶段的分界线。
所有,有时也会把yield当成是return。但是,yield与return有本质的不同。
执行Generator函数(next方法):
next()方法的作用:分阶段的执行Generator函数。
next方法的使用:
- 无参数
- 有参数:
- 传入的参数:其实就是把上一个yield语句的返回值给覆盖了。
- 第一个.next()方法其实就是启动器
- 在它之前没有yield语句,所以给第一个.next()方法,是没有意义的。
- 给next函数传值不会修改之前的声明的变量的值。
// 定义Generator函数
function* xxfn(){
var _n = 1;
var _v = yield _n + 22;
console.log('aa---:' + _v);
yield ++_n;
yield ++_n;
yield ++_n;
}
var _xxfn = xxfn();
// 第一个 { value: 23, done: false }
/**
* 简单的赋值操作语句
* 还没有到运行到_v赋值的阶段,到第一个yield的时候就停止了
*/
console.log(_xxfn.next());
// 第二个next aa---:abc { value: 2, done: false }
/**
* 传入的参数把之前上一个yield语句的返回值给覆盖了。
* 上一个yield语句:_n + 22
* 传入了 abc :yield _n + 22 ===> yield abc ,然后又赋值给了 _v
* 然后遇见了下一个yield 就停止了
*/
console.log(_xxfn.next("abc"));
console.log(_xxfn.next());// { value: 2, done: false }
next方法的返回值:
每次调用.next()方法,会返回一个对象。表示当前阶段的信息:
- value属性:
- done属性:(是否执行结束)
- true:表示函数执行完成
- false:表示函数执行未完成
// 定义Generator函数
function* xxfn(){
yield 'a';
yield 'b';
yield 'c';
return 'd';
}
var _xxfn = xxfn();
console.log(_xxfn.next());// { value: 'a', done: false }
console.log(_xxfn.next());// { value: 'b', done: false }
console.log(_xxfn.next());// { value: 'c', done: false }
console.log(_xxfn.next());// { value: 'd', done: true }
console.log(_xxfn.next());// { value: undefined, done: true
迭代器的引用:
每个迭代器之间是相互独立的,作用域独立。
每当你调用了一个迭代器内部的.next()方法,
Generator函数内部的指针,会从上一次停下来的地方,继续运行,直到遇见下一个yield语句。
// 定义Generator函数
function* xxfn(){
var _n = 1;
yield ++_n;
yield ++_n;
yield ++_n;
}
var aa = xxfn();
var bb = xxfn();
console.log(aa.next());// { value: 2, done: false }
console.log(aa.next());// { value: 3, done: false }
console.log(bb.next());// { value: 2, done: false }
为什么说是迭代器对象?
要把所有的yield语句都走上一遍。