ES6 generator 基础
参考文档
Generator是ES6的新特性,通过yield关键字,可以让函数的执行流挂起,那么便为改变执行流程提供了可能。
创建Generator
function * main() {
var x = yield 1;
var y = yield 2;
var z = yield 3;
}
使用以上语法就可以声明一个generator,注意main是一个函数
判断是否为generator
function isGen(fn) {
return 'function' === typeof fn && fn.constructor.name === 'GeneratorFunction';
}
generator的构造器
main.constructor //function GeneratorFunction() { [native code] }
Generator Object
生成Generator Object
var g= main();
console.info(typeof g)
g是Generator Object,在MDN上称为generator-iterator
Generator Object方法
next
虽然main被调用了,但是并没有执行里面的方法体,而是返回了一个Generator Object,如何调用里面的方法体呢,这就要使用next方法
console.log(g.next());//{value: 1, done: false}
next方法在es6中定义如下
The next function’s behavior is:
1.If this is not a generator object, Throw Error
2.Call this.[[Send]] with single argument undefined
3.Return the result
next方法会执行函数体,直到遇到第一个yield语句,然后挂起函数执行,等待后续调用。但是next会返回一个对象,这个对象有2个key,value表示yield语句后面的表达式的值('hello'),done是个布尔值,表示函数体是否已经执行结束。再次调用g。next时,执行流在挂起的地方继续执行,直到遇到第2个yield,依次类推。
console.log(g.next());//{value: 2, done: false}
console.log(g.next());//{value: 3, done: false}
console.log(g.next());//{value: undefined, done: true}
Tips:有时候我们把yield看成是return
next方法也接受传参,传入参数作为yield语句的返回值;
function *main() {
var x = yield 1;
console.log(x)
}
var g=main();
g.next();
g.next("hello world") //hello world
next方法的特性很总要,很多基于generator做的流程控制都基于这个特性。
异常处理
function * main(){
yield;a+b
}
var m=main()
m.next()
m.next() //Uncaught ReferenceError: a is not defined
我们可以使用catch捕获异常
yield 和 yield*
yield* 是委托提取器。yield 是你给什么它提取什么,但是 yield* 会继续向下请求,直到没的提取为止。
function* a() { yield 1; yield 2; yield 3; }
function* b() { yield 4; yield* a(); yield 5; }
function* c() { yield 6; yield* b(); yield 7; }
var cc = c();
cc.next(); // {value: 6, done: false}
cc.next(); // {value: 4, done: false}
cc.next(); // {value: 1, done: false}
cc.next(); // {value: 2, done: false}
cc.next(); // {value: 3, done: false}
cc.next(); // {value: 5, done: false}
cc.next(); // {value: 7, done: false}
cc.next(); // {value: undefined, done: true}
DEMO
function * G () {
console.log(yield function () {
console.log("func");
});
}
var g = G();
console.log(g.next());
//{ value: [Function], done: false }
console.log(g.next("hi"));
//hi
//{ value: undefined, done: true }
支持情况
- Chrome 35+ (about://flags中开启)
- Firefox 31+ (默认开启)
- nodejs harmony
ES6 generator 基础的更多相关文章
- es6 generator 基础知识
1.定义和使用 function *gen() { return 'first generator'; } // 有点类似类的实例化过程 let generatorResult = gen() // ...
- es6常用基础合集
es6常用基础合集 在实际开发中,ES6已经非常普及了.掌握ES6的知识变成了一种必须.尽管我们在使用时仍然需要经过babel编译. ES6彻底改变了前端的编码风格,可以说对于前端的影响非常巨大.值得 ...
- es6 generator函数的异步编程
es6 generator函数,我们都知道asycn和await是generator函数的语法糖,那么genertaor怎么样才能实现asycn和await的功能呢? 1.thunk函数 将函数 ...
- ES6 Generator vs ES6 async/await
ES6 Generator vs ES6 async/await next yield promise refs xgqfrms 2012-2020 www.cnblogs.com 发布文章使用:只允 ...
- ES6 Generator的应用场景
一.基础知识 API文档 ES6 诞生以前,异步编程的方法,大概有下面四种. 回调函数 事件监听 发布/订阅 Promise 对象 Generator 函数将 JavaScript 异步编程带入了一个 ...
- es6 --- Generator 函数
第一部分,ES6 中的 Generator 在 ES6 出现之前,基本都是各式各样类似Promise的解决方案来处理异步操作的代码逻辑,但是 ES6 的Generator却给异步操作又提供了新的思路, ...
- ES6生成器基础
ES6引进的最令人兴奋的特性就是一种新的函数生成方式,称为生成器(generator).名称有点奇怪,但是第一眼看上去行为更加奇怪.文章主要介绍生成器如何工作,然后让你明白为什么他们对于未来的JS会有 ...
- es6属性基础教学,30分钟包会
ES6基础智商划重点在实际开发中,ES6已经非常普及了.掌握ES6的知识变成了一种必须.尽管我们在使用时仍然需要经过babel编译.ES6彻底改变了前端的编码风格,可以说对于前端的影响非常巨大.值得高 ...
- es6 generator函数
es6 新增了Generator函数,一种异步编程的解决方案 回顾一下,es6 提供了新的遍历方法,for of ,适用于各种数据集合,统一了遍历操作,原生支持for of 集合的数据集合有.数组,字 ...
随机推荐
- linux下robotframework执行测试用例的几种方法
1.执行指定的测试用例文件(Test Suite) [root@localhost cases]# pybot purge.txt 2.执行整个porject目录下的所有测试用例 ...
- Google论文BigTable拜读
这周少打点dota2,争取把这篇论文读懂并呈现出来,和大家一起分享. 先把论文搞懂,然后再看下和论文搭界的知识,比如hbase,Chubby和Paxos算法. Bigtable: A Distribu ...
- IPv4地址(二)网络划分
在IPv4地址(一)中提到过,IP地址可以分成两部分,前面一部分是网络号,而后面一部分是主机号. 这里网络可以通过主机数量规模不同而分为3类:大型网络.中型网络和小型网络. 不同网络的特点 大型网络— ...
- js时间戳格式化成日期格式的多种方法
js需要把时间戳转为为普通格式,一般的情况下可能用不到的, 下面先来看第一种吧 复制代码代码如下: function getLocalTime(nS) { return new Date(parseI ...
- JS常见事件以及函数
1.js enter键激发事件 document.onkeydown = function (e) { if (!e) e = window.event; ...
- p2p webrtc服务器搭建系列1: 房间,信令,coturn打洞服务器
中继(relay) 在RTCPeeConnection中,使用ICE框架来保证RTCPeerConnection能实现NAT穿越 ICE,全名叫交互式连接建立(Interactive Connecti ...
- python 基础 6.0 异常的常用形式
一. 异常 异常既是一个时间,该事件会在程序执行过程中发生,影响了程序的正常执行.一般情况下,在python无法正常处理程序时就会发生一个异常.异常是python对象,表示一个错误.当python ...
- PHP错误调试
一:错误类型举例 1.语法错误:一般是语句最后缺少分号.缺少单引号或双引号.for循环或函数缺少花括号.缺少变量标示符$ 2.定义错误:一般是调用不存在的变量.调用不存在的函数或者类 3.逻辑错误:代 ...
- 各种RTMP直播流播放权限_音视频_数据花屏_问题检测与分析工具EasyRTMPClient
之前的一篇博客<网络摄像机IPCamera RTSP直播播放网络/权限/音视频数据/花屏问题检测与分析助手EasyRTSPClient>,我们介绍了RTSP流的检测和分析工具EasyRTS ...
- EasyNVR NVR网页无插件直播在兼容宇视NVR RTSP流媒体时PLAY过程对Scale的兼容
前一段在维护EasyNVR客户的过程中遇到一个问题,在接入宇视NVR的时候,就是明明在vlc中能非常正常播放的视频流,却用EasyRTSPClient RTSP客户端拉流的协议交互过程中,PLAY命令 ...