ECMAScript Generator

Generator 函数是一种异步编程解决方案。

它是一个状态机,内容有多个状态。

执行generator函数会返回一个遍历器对象,可以获得每个不同的状态。

它的语法:

function* 名称(){

yield 返回表达式;

}

有两个特点:

1funcion 关键字后添加了*

2内部yield用法

function* helloWorldGenerator() {
  yield 'hello';
  yield 'world';
  return 'ending';
}

var hw = helloWorldGenerator();
它在调用时并不会执行函数,返回的是一个指向内部状态的指针对象。

可以通过hw.next()来遍历状态并获取返回值。

会返回一个对象value表示返回值,done表示是否遍历结束。

当然generator是可以有参数的,它也是函数,所以有函数的所有特点。


function* generator(){
console.log('a');
//遇到yield 就停止执行后边,并将yield 后的表达式值,作为value返回
yield 'a';
//下一次next时继续执行yeild后的,直到下一个yield
console.log('b');
//yield 后的表达式只有当调用next指针指向时才执行。
yield 'b';
console.log('c');
//如果没有了yield 一直执行到return 为止,并把 return 后的作为value.
//如果没有return 那么value 就是undefined
return 'c';//return 表示最后的状态
}
//调用后函数并不会执行,返回的也不是结果
//而是一个内部状态的指针对象,通过next(XX)来移动状态和传递值.
//状态通过yield 来设置,它是暂停的标记,next用来恢复执行。


var hw=generator();
//next()输出的对象value表示yeild XX的值,done表示是否结束
//当第一个next时才会从函数第一行开始执行到第一个yield 
console.log(hw.next());
console.log('-----------------')
console.log(hw.next());
console.log('-----------------')
console.log(hw.next());


yield:

只有调用next()才会遍历下一个内部状态,

所以其实提供了一种可以暂停执行的函数。yield语句就是暂停标志。

遍历器对象的next方法的运行逻辑如下。

(1)遇到yield语句,就暂停执行后面的操作,并将紧跟在yield后面的那个表达式的值,作为返回的对象的value属性值。

(2)下一次调用next方法时,再继续往下执行,直到遇到下一个yield语句。

(3)如果没有再遇到新的yield语句,就一直运行到函数结束,直到return语句为止,并将return语句后面的表达式的值,作为返回的对象的value属性值。

(4)如果该函数没有return语句,则返回的对象的value属性值为undefined

yield后的表达式,只有调用next时它才会执行并返回,
第一个next时会从函数顶开始执行直到第一个yield

Generator函数可以不用yield语句,这时就变成了一个单纯的暂缓执行函数。


与Iterator接口的关系

上一章说过,任意一个对象的Symbol.iterator方法,等于该对象的遍历器生成函数,调用该函数会返回该对象的一个遍历器对象。

由于Generator函数就是遍历器生成函数,因此可以把Generator赋值给对象的Symbol.iterator属性,从而使得该对象具有Iterator接口。

var myIterable = {};
myIterable[Symbol.iterator] = function* () {
  yield 1;
  yield 2;
  yield 3;
};

[...myIterable] // [1, 2, 3]

next方法的参数 § 

yield句本身没有返回值,或者说总是返回undefinednext方法可以带一个参数,该参数就会被当作上一个yield语句的返回值。

function* f() {
  for(var i=0; true; i++) {
    var reset = yield i;
    if(reset) { i = -1; }
  }
}

var g = f();

g.next() // { value: 0, done: false }
g.next() // { value: 1, done: false }
g.next(true) // { value: 0, done: false }
next()可以传递值给函数的。

可以把yield 赋值给变量,这样变量就可以获取next下次调用时传递的值。

for...of循环

for...of循环可以自动遍历Generator函数,且此时不再需要调用next方法。

function *foo() {
  yield 1;
  yield 2;
  yield 3;
  yield 4;
  yield 5;
  return 6;
}

for (let v of foo()) {
  console.log(v);
}
// 1 2 3 4 5
前面章节曾经介绍过, for...of 循环、扩展运算符( ... )、解构赋值和 Array.from 方法内部调用的,都是遍历器接口。这意味着,它们可以将Generator函数返回的Iterator对象,作为参数。

[...numbers()] // [1, 2]

Array.from(numbers()) // [1, 2]

g.return(val)

可以返回给定的值,并且终结遍历Generator函数。


yield * 

//在generator 内调用另一个generator 函数。
//用法yield * Gen()
//在遇到另一个generator 时会执行它,在它执行完后,再加到原来的generator


var arr=[1,2,3,4,5,[6,7,8]];


function* generator(a){
var len=a.length;
for(var i=0;i<len;i++){
var it=a[i];
if(typeof it !=='number'){
yield * generator(it);
}else{
yield it;
}
}
}


var g=generator(arr);
for(var i of g){
console.log(i);
}


yield可以执行一个ajax回调内调用next来执行

//generator 在ajax中应用
//可以在ajax回调内调用next并传递值。
//这样就可以执行yield后的代码了。
//并且result可以获取到ajax的结果。并进行处理。
var request=require('request');
function* main(){
var result=yield request('http://www.baidu.com',function(err,res,body){
it.next(body);
})
console.log(result);
}
var it=main();
it.next();



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值