Generator函数语法

基础概念
- *星号的位置
- next方法的参数
- tips

基础概念

Generator 函数是 ES6 提供的种异步编程解决方案，语法行为与传统函数完全不同。
执行 Generator 函数会返回个遍历器对象也就是说， Generator 函数除了是状态机，还是个遍历器对象生成函数
返回的遍历器对象可以依次遍历 Generator 函数内部的每个状态。
形式上， Generator 函数是个普通函数，但是有三个特征： function 命令与函数名之间有个星号*：二是函数体内部使用
yield 吾句定义不同的内部状态（“ yield ”在英语里的意思就是“产出“);三是使得指针移向下状态。也就是说，每次调用
next 方法，内指针就从函数头部或上次停下来的地方开始执行直到遇到下一条yield 语句（或 return 语句）为止；换言之
Generator 函数是分段执行的； yield 语句是暂停执行的标记；next 方法可以恢复执行；

function* GeneratorExam() { yield ’hello1’; yield ’hello2’; return ’helloending’;
}
var suchAs = GeneratorExam() ;

上边代码定义了一个geerator函数 GeneratorExam ，内部有三个状态hello1,hello2,helloending(return语句会结束执行)；

suchAs.next(); //{value:'hello1',done:false}suchAs.next(); //{value:'hello2',done:false}suchAs.next(); //{value:'helloending',done:true}suchAs.next(); //{value:undefined,done:true}

上边代码一共调用了四次next()方法

第一次调用， Generator 函数开始执行；直到遇到第 yield 语句为止 next 方法返回一个对象，它的 value
属性就是当前 yield 吾句的值 hello1, done 属性的值 false 表示遍历还没有结束。
第二次调用， Generator 函数从上次 yield 语句停下的地方，一直执行到下 yield语句。next 方法返回的对象的
value 属性就是当前 yield 语句的值hello2, done 属性false 表示遍历还没有结束。
第三次调用， Generator 函数从上次 yield 语句停下的地方，一直执行到 return 语句（如果没有 return 语句
就执行到函数结束）； next 方法返回的对象的 value 属性就是紧跟在 return 语句后面的表达式的值（如果没有 return
吾句 value 属性的值为 undefined) done 属性的值 true 表示遍历己经结束。
第四次调用，此时Generator函数已经运行完毕，next方法返回对象的value值为undefined，done为true,以后再调用这个方法，都是这个值。
总结一下，调用Generator函数返回一个遍历器对象，代表generator函数的内部指针，以后每次调用遍历器对象的next()方法，就会返回一个有value和done两个属性的对象。value代表当前的内部状态的值，done代表遍历是否结束。

*星号的位置

ES6没有规定function关键字和函数名之间的*星号写在哪个位置，所以以下写法都能通过。

function * such (x , y) { }
function *such (x, y) {}
function* such (x, y) { }
function*such (x, y) {}

next方法的参数

yield 语句本身没有返回值，或者说总是返回 undefined next 方法可以带有个参数，该参数会被当作上一条 yield 语句的返回值

function* f () {for(var i = O; 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}

上面的代码先定义了个可以无限运行的 Generator 函数，如果 next 方法没有参数，每次运行到 yield 吾句时，变量
reset 的值总是 undefined 。当 next 方法带有一个参数 true 时，当前的变量 reset 就被重置为这个参数（即
true ），因而会等于－，下轮循环就从－开始递增。
这个功能有很重要的语法意义 Generator 函数从暂停状态到恢复运行，其上下文状态 (context ）是不变的通过 next
方法的参数就有办法在 Generator 函数开始运行后继续向函数体内部注入值也就是说，可以在
Generator函数运行的不同阶段从外部向内部注入不同的值，从而调整函数行为。

再看一个例子

function* foo (x) { var y = 2 * (yield (x + 1)); var z = yield (y / 3) ; return (x + y + z);
}
var a = foo(5);
a.next() //{value:6, done:false}
a.next () //{value:NaN, done:false}
a.next () //{value:NaN, done:true}
var b=foo(5);
b.next() //{value:6,done:false}
b.next(12) //{value:8,done:false}
b.next(13) //{value:42,done:true}

上面的代码中，第二次运行 next 方法的时候不带参数，导致 y的值等于 *undefined (即NaN ），除以3 以后还是 NaN
，因此返回对象的 value 属性也等于 NaN，第三次运行 Next方法的时候不带参数所以等于 undefined ，返回对象的
value 属性等于 + NaN + undefined, 为NaN。
如果向口next 方法提供参数，返回结果就完全不一样了上面的代码第次调用b的next 方法时，返回x+1的值6,第二次调用next()方法，将第一次yeild语句值设为12，因此y=24,返回y/3为8；第三次调用next();将上一次yeild设置为13,因此z为13；x=5;y=24;return为42；

tips

由于next方法的参数表示上一条yield的返回值，因此第一次使用next（）方法传参时无效的；V8引擎直接忽略第一次next方法传参；
当然如果想在第一次调用方法就能输入值，可以在Generator函数外面再包一层。

function wrapper(generatorFunction) { return function ( ... args) { let generatorObject = generatorFunction( ... args) ; generatorObject.next() ; return generatorObject;};
}const wrapped= wrapper(function* () { console.log(First put ${yield}）；return ’ DONE ’ ;
}）
wrapped().next('hello!') //First put hello!

参考：
书籍：《ES6标准入门》；

Generator函数语法相关推荐

php中reset()函数,php reset()函数语法
PHP reset() 函数定义和用法 reset()函数把数组的内部指针指向第一个元素,并返回这个元素的值.若失败,则返回 FALSE. reset()函数用来将数组指针设置回数组的开始位置.如果 ...
Generator函数的语法以及异步的应用
基本概念 Generator函数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同.Generator函数有多种理解角度.语法上,首先可以把它理解成,Generator函数是一个状态机,封 ...
“睡服”面试官系列第十八篇之generator函数的语法（建议收藏学习）
目录 1简介 1.1基本概念 1.2yield 表达式 1.3与 Iterator 接口的关系 2. next 方法的参数 3. for...of 循环 4. Generator.prototype. ...
ES6——Generator 函数的语法
Generator 函数是一个状态机,封装了多个内部状态.执行 Generator 函数会返回一个遍历器对象,也就是说,Generator 函数除了状态机,还是一个遍历器对象生成函数.返回的遍历器对象 ...
ES6学习（九）—Generator 函数的语法
ES6学习(九)-Generator 函数的语法 Generator 函数是 ES6 提供的一种异步编程解决方案,语法行为与传统函数完全不同. Generator函数是一个状态机,内部封装了不同状态的 ...
ES6语法总结(21)--Generator函数的异步应用
Generator 函数的异步应用传统方法基本概念 Generator 函数 Thunk 函数 co 模块异步编程对 JavaScript 语言太重要.JavaScript 语言的执行环境是&q ...
JavaScript 异步编程--Generator函数、async、await
JavaScript 异步编程–Generator函数 Generator(生成器)是ES6标准引入的新的数据类型,其最大的特点就是可以交出函数的执行的控制权,即:通过yield关键字标明需要暂停的语 ...
【ES6】Generator函数详解
[ES6]Generator函数详解一.Generator函数简介基本概念函数写法 yield关键字介绍二.next方法的参数三.for...of循环四.关于普通throw()与Gener ...
es6 中的generator函数控制流程
Generator函数跟普通函数的写法有非常大的区别: 一是,function关键字与函数名之间有一个星号: 二是,函数体内部使用yield语句,定义不同的内部状态(yield在英语里的意思就是&qu ...

Generator函数语法

Generator函数语法

基础概念

*星号的位置

next方法的参数

tips

Generator函数语法相关推荐

最新文章

热门文章