ES6 Generator

Generator

Generator是es6引入的,主要用于异步编程。

最大特点是可以交出函数的执行权(即暂停执行)。

它和普通的函数写法有点不同

function关键字与函数名之间有一个*号,以与普通函数进行区别。

它不同于普通函数,是可以==暂停执行==的。

Generator函数体内部==使用yield语句==,可以定义不同的状态。

现在都是状态====数据

yield是异步的分界线,可以把它理解为return。但和return还是存在本质的区别。

先来看一个最简单的==Generator==函数

function* fn() {
    yield 'a';
    yield 'b';
    yield 'c';
    return 'd';
}
let fn1 = fn();
console.log(fn1.next());
console.log(fn1.next());
console.log(fn1.next());
console.log(fn1.next());

// 输出结果:
{ value: 'a', done: false }
{ value: 'b', done: false }
{ value: 'c', done: false }
{ value: 'd', done: true } 

要想动起来,我们得使用next方法。每次调用next方法,返回一个对象。

​ 这个对象表示当前的阶段信息。value属性,done属性:返回一个boolean值。其中true表示函数已经执行完了,false表示函数还需要执行。还有下一个next。遇到了return的时候,done才会返回true。


迭代器

==不同的迭代器指向的指针==是不一样的。例如下面这段代码:

function* fn() {
    let n = 1;
    yield ++n;
    yield ++n;
    return ++n;
}
let fn1 = fn();
let fn2 = fn();
console.log(fn1.next());
console.log(fn1.next());
console.log(fn2.next());
console.log(fn1.next());
// output
{ value: 2, done: false }
{ value: 3, done: false }
{ value: 2, done: false }
{ value: 4, done: false }

每一个迭代器对象都有专属于自己的指针,每次执行的位置就是==上次迭代器遗留下来==的位置。


==.next()方法==可以接受参数

​ 传入的参数,就是把上次yield语句的返回的值给覆盖了。

第一个yield语句因为在它之前没有yield语句,所以给==第一个yield语句传递参数==是没有意义的!

function* fn() {
    // 第一次执行开始
    let _n = 1;
    let _v = yield _n + 22;
    console.log("aa-----:" + _v);
    // 第一次执行结束,第二次结束
    yield ++_n;
    // 第二次结束,第三次开始
    yield ++_n;
}
let fn1 = fn();
console.log(fn1.next());
console.log(fn1.next('abc'));
console.log(fn1.next());
// 注释
/*
	{ value: 23, done: false }
	aa-----:abc	
	{ value: 2, done: false }
	{ value: 3, done: false }
*/

Generator函数,支持for of 循环

​ 用来迭代Generator函数在执行时生成的那个迭代对象。

function* fn() {
    // 第一次执行开始
    let _n = 1;
    let _v = yield _n + 22;
    console.log("aa-----:" + _v);
    // 第一次执行结束,第二次结束
    yield ++_n;
    // 第二次结束,第三次开始
    yield ++_n;
}
let fn1 = fn();
/* console.log(fn1.next());
console.log(fn1.next('abc'));
console.log(fn1.next()); */
for (let i of fn1) {
    console.log(i);
}

采用这个打印效果,和上述的三次console.log()结果是一样的。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值