标签:end 通过 gen OLE 准备 很多 16px 启动 nbsp
ES6提供的Generator语法可以暂停函数的执行,这一点在思考问题上很有帮助。我在考虑问题时常常遇到先执行函数,到某个时刻暂停执行,做一些其他操作后再继续执行函数这样的问题。
当时只是美好的想象,如果函数可以暂停执行就好了。ES6的Generator正是提供这种暂停的机制的。
原打算好好学习一下怎么使用Generator函数的,奈何看了一遍发现有点难度,而且现在正在准备面试,继续深究下去不明智。
既然看了基础的部分就简单记录一下吧,细节及其具体的应用之后再来填坑。
Generator的中文可以解释为生成器。所谓生成器一定是可以生成某一样东西的。JS的生成器Generator是用来生成迭代器的。
也就是说,Generator函数是一种可以返回迭代器的函数。
语法上有2个特征:
可以把Generator函数理解成封装了一系列状态的状态机,调用Generator函数会返回一个迭代器对象,这个迭代器对象可以遍历每一个状态。
1 function* helloworldGenerator() { 2 console.log(‘start‘); 3 console.log(`first state: ${yield ‘1‘ + ‘1‘}`); 4 console.log(`second state: ${yield ‘2‘ + ‘2‘}`); 5 console.log(‘end‘); 6 return ‘over‘; 7 } 8 let hello = helloworldGenerator();
上面定义了一个generator函数,其中有2个yield语句。需要注意的是,调用迭代器的next方法只会执行yield后面的语句,并把结果作为value返回,并不会执行yield语句所在的整个一行语句。
console.log(hello.next());
这里只调用一次next方法,该方法会让Generator函数从函数的开头开始执行,一直到第一个yield语句执行结束。
1 start 2 { value: ‘11‘, done: false }
可以看到
再调用next方法
1 first state: undefined 2 { value: ‘22‘, done: false }
可以看到
再调用next方法
1 second state: undefined 2 end 3 { value: ‘over‘, done: true }
可以看到
根据上面的测试,我们来整理一下next方法的运行逻辑:
yield语句的返回值
根据上面的测试,可以看到yield语句的返回值是undefined,Generator函数支持通过给next方法传递参数来作为上一次yield语句的返回值。
还是使用上面的例子,只不过这里调用时给next方法传递了参数。
1 console.log(hello.next()); 2 console.log(hello.next(‘first‘)); 3 console.log(hello.next(‘second‘));
运行结果
1 start 2 { value: ‘11‘, done: false } 3 first state: first 4 { value: ‘22‘, done: false } 5 second state: second 6 end 7 { value: ‘over‘, done: true }
可以看到,next方法的参数作为了yield语句的返回值被打印出来了。
第一个yield语句是启动迭代器对象,所以不要带参数,JS会忽略第一个next方法的参数。
总结:
上面就是Generator函数的简单介绍。给函数添加暂停功能有很多实际的应用,后面会逐步介绍。
标签:end 通过 gen OLE 准备 很多 16px 启动 nbsp
原文地址:https://www.cnblogs.com/wangtingnoblog/p/js_Generator.html