北京企业网站设计,flash网址,装潢公司网站设计与制作,品牌网站建设信息function*
function* 这种声明方式 (function关键字后跟一个星号#xff09;会定义一个生成器函数 (generator function)#xff0c;它返回一个 Generator 对象。 function * gen(){console.log(heloo generator)}如何调用呢#xff1f;先看下里面的内容 返回…function*
function* 这种声明方式 (function关键字后跟一个星号会定义一个生成器函数 (generator function)它返回一个 Generator 对象。 function * gen(){console.log(heloo generator)}如何调用呢先看下里面的内容 返回一个这个生成器的 迭代器 iterator 对象。 iterator.next();语法
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/function* 语法 function* name([param[, param[, … param]]]) { statements } name 函数名
param 要传递给函数的一个参数的名称一个函数最多可以有 255 个参数。
statements 普通 JS 语句。
描述 生成器函数在执行时能暂停后面又能从暂停处继续执行。
调用一个生成器函数并不会马上执行它里面的语句而是返回一个这个生成器的 迭代器 iterator 对象。当这个迭代器的 next() 方法被首次后续调用时其内的语句会执行到第一个后续出现yield的位置为止yield 后紧跟迭代器要返回的值。或者如果用的是 yield*多了个星号则表示将执行权移交给另一个生成器函数当前生成器暂停执行。
next()方法返回一个对象这个对象包含两个属性value 和 donevalue 属性表示本次 yield 表达式的返回值done 属性为布尔类型表示生成器后续是否还有 yield 语句即生成器函数是否已经执行完毕并返回。
调用 next()方法时如果传入了参数那么这个参数会传给上一条执行的 yield 语句左边的变量
next调用 function * gen(){// console.log(111);yield 一只没有耳朵;// console.log(222);yield 一只没有尾部;// console.log(333);yield 真奇怪;// console.log(444);}let iterator gen();console.log(iterator.next());console.log(iterator.next());console.log(iterator.next());console.log(iterator.next());遍历
既然是迭代器就可以采用for of遍历。 function * gen(){yield 一只没有耳朵;yield 一只没有尾部; yield 真奇怪;}let iteratorgen();//遍历for(let v of gen()){console.log(v);}生成器接收参数
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title生成器函数参数/title
/head
bodyscriptfunction * gen(arg){console.log(arg);let one yield 111;console.log(one);let two yield 222;console.log(two);let three yield 333;console.log(three);}//执行获取迭代器对象let iterator gen(AAA);console.log(iterator.next());//next方法可以传入实参console.log(iterator.next(BBB));console.log(iterator.next(CCC));console.log(iterator.next(DDD));/script
/body
/html异步编程
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title生成器函数实例/title
/headbodyscript// 异步编程 文件操作 网络操作(ajax, request) 数据库操作// 1s 后控制台输出 111 2s后输出 222 3s后输出 333 // 回调地狱// setTimeout(() {// console.log(111);// setTimeout(() {// console.log(222);// setTimeout(() {// console.log(333);// }, 3000);// }, 2000);// }, 1000);function one(){setTimeout((){console.log(111);iterator.next();},1000)}function two(){setTimeout((){console.log(222);iterator.next();},2000)}function three(){setTimeout((){console.log(333);iterator.next();},3000)}function * gen(){yield one();yield two();yield three();}//调用生成器函数let iterator gen();iterator.next();/script
/body/html生成器函数实例
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title生成器函数/title
/head
bodyscript//模拟获取 用户数据 订单数据 商品数据 function getUsers(){setTimeout((){let data 用户数据;console.log(data);//调用 next 方法, 并且将数据传入iterator.next(data);}, 1000);}function getOrders(){setTimeout((){let data 订单数据;console.log(data);iterator.next(data);}, 1000)}function getGoods(){setTimeout((){let data 商品数据;console.log(data);iterator.next(data);}, 1000)}function * gen(){let users yield getUsers();let orders yield getOrders();let goods yield getGoods();}//调用生成器函数let iterator gen();iterator.next();/script
/body
/html
