ES6新特性之生成器函数 (generator function): function*
一、什么是生成器函数?
生成器函数是ES6的新特性之一,它是一个在执行时能中途暂时退出,后面重新调用又能重新进入继续执行的一种函数。
并且在函数内定义的变量的所有状态不受中途退出的影响。
二、语法
声明方式:
function* 函数名([参数1[, 参数2[, ... 参数n]]]) { JS语句 }
调用说明:
1) 调用生成器对象时会返回一个生成器的迭代器
2) 该迭代器中有一个next()方法,它返回一个包含value和done的对象
3) 每次调用next()方法遇到yied表达式位置暂停执行
4) value表示yied表达式的返回值,done表示该生成器最后一个值是否已经产生
5)如果给next()方法传递参数, 参数的值会代替yied表达式的返回值
6) 如果在生成器中调用return,生成器将提前完成
三、示例
1、定义一个自增生成器函数,每次next()调用返回自增的值
输出如下:
>1 false
>2 false
>3 false
>4 false //想想为什么是false?
>undefined true
我们做了什么事:
1) 声明一个生成器函数increment(n),每次判断小于n时自增
2) 每次自增用yield表达式,返回表达式的值,然后自增(因为是后缀++)
function* increment(n){
var index = 1;
while(index<n)
yield index++;
}
3) 调用生成器函数,返回一个迭代器对象,赋给变量it
var it = increment(5);
4) for循环遍历
//为什么要多声明一个temp变量?
for(let i = 0; i<5; i++)
{
let temp = it.next();
console.log(temp.value);
console.log(temp.done);
}
直接使用it.next()
for(let i = 0; i<5; i++)
{
console.log(it.next().value);
console.log(it.next().done);
} //输出为:1, false, 3, false, undefined, true, undefined, true, undefined, true
2、给next()传递参数
function* increment(){
let index = 1;
console.log(yield index++);
console.log(yield index++);
console.log(yield index++);
} var it = increment(); it.next();
it.next(3);
it.next(9);
输出为:3,9
3、显式返回
function* increment(){
let index = 1;
yield index++;
return "complete";
yield index++;
yield index++;
} var it = increment(); console.log(it.next().value); { value: 1, done: false }
console.log(it.next().value); { value: "complete", done: true }
console.log(it.next().value); { value: undefined, done: true }
四、补充
yield*
语法:
yield* [[表达式]]
说明:
yield*
expression 用于委托给另一个generator或可迭代对象。
栗子:
function* increment_slowly(){
let index = 1.1;
yield index = 1.2;
yield index += 0.11;
} function* increment(){
let index = 1;
yield index++;
yield* increment_slowly();
yield index++;
} var it = increment(); console.log(it.next().value); // >1
console.log(it.next().value); // >1.2
console.log(it.next().value); // >1.31
console.log(it.next().value); // >2
题外话:这个排版有点丑,打算去看看博客园怎么排版,下一篇文章做做排版,更加清晰地显示。
ES6新特性之生成器函数 (generator function): function*的更多相关文章
- 轻松学会ES6新特性之生成器
生成器虽然是ES6最具魔性的新特性,但也是最难懂得的一节,笔者写了大量的实例来具体化这种抽象的概念,能够让人一看就懂,目的是希望别人不要重复或者减少笔者学习生成器的痛苦经历. 在说具体的ES6生成器之 ...
- ES6新特性:Javascript中Generator(生成器)
ES6的很多特性都跟Generator扯上关系,而且实际用处比较广, 包含了任何需要异步的模块, 比如ajax, filesystem, 或者数组对象遍历等都可以用到: Generator的使用: G ...
- ES6新特性之箭头函数与function的区别
写法不同 // function的写法 function fn(a, b){ return a+b; } // 箭头函数的写法 let foo = (a, b) =>{ return a + b ...
- ES6新特性3:函数的扩展
本文摘自ECMAScript6入门,转载请注明出处. 一.函数参数默认值 1. ES6允许为函数的参数设置默认值,即直接写在参数定义的后面. function log(x, y = 'World') ...
- es6新特性之箭头函数
<script> { // es3,es5 var evens = [1, 2, 3, 4, 5]; var odds = evens.map(function (v) { return ...
- ES6新特性三: Generator(生成器)函数详解
本文实例讲述了ES6新特性三: Generator(生成器)函数.分享给大家供大家参考,具体如下: 1. 简介 ① 理解:可以把它理解成一个函数的内部状态的遍历器,每调用一次,函数的内部状态发生一次改 ...
- ES6生成器函数generator
ES6生成器函数generator generator是ES6新增的一个特殊函数,通过 function* 声明,函数体内通过 yield 来指明函数的暂停点,该函数返回一个迭代器,并且函数执行到 y ...
- ES6新特性(函数默认参数,箭头函数)
ES6新特性之 函数参数的默认值写法 和 箭头函数. 1.函数参数的默认值 ES5中不能直接为函数的参数指定默认值,只能通过以下的变通方式: 从上面的代码可以看出存在一个问题,当传入的参数为0或者 ...
- ES6新特性简介
ES6新特性简介 环境安装 npm install -g babel npm install -g babel-node //提供基于node的REPL环境 //创建 .babelrc 文件 {&qu ...
随机推荐
- 【Android Developers Training】 72. 缩放一个视图
注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...
- eclipse在多modules项目结构下避免模块间依赖引用的场景
这个在单一classLoader时,不会有问题.如果多classloader下会有问题. 假设工程有两个模块,module2 依赖module1 当我们执行mvc eclipse:eclipse后,然 ...
- call, apply,bind 方法解析
call(), apply(),bind() 三者皆为Function的方法 call(),apply()的作用是调用方法,并改变函数运行时的context(作用上下文) bind() 的作用是引用方 ...
- Linux 重启和关机命令
shutdown -r 05:30 在凌晨五点30分关机 shutdown -r 05:30 & 后台执行 shutdown -c 取消前一个关机命令 ...
- [问题解决]linux sudo xxx:command not found
题外话 软件的安装在linux下主要分为两种.一种是通过包管理器例如ubuntu的apt-get xxx,另一种是自己手动安装.通过包管理器安装的,基本开箱即用,无需配置,但是存在一个问题,有时候无法 ...
- Struts2从头到脚--学习笔记(自认为比较重要的)
一. Struts2框架介绍 Struts2是一个基于MVC设计模式的Web应用框架,它本质上相当于一个servlet,在MVC设计模式中,Struts2作为控制器(Controller)来建立模型与 ...
- hdu_5868:Different Circle Permutation
似乎是比较基础的一道用到polya定理的题,为了这道题扣了半天组合数学和数论. 等价的题意:可以当成是给正n边形的顶点染色,旋转同构,两种颜色,假设是红蓝,相邻顶点不能同时为蓝. 大概思路:在不考虑旋 ...
- [编辑器]vim常用操作
我是ide的用户,对于vim一只停留在:打开.看.写.关闭基本操作,因为现在更多的接触linux服务器,所以为了提高 效率,用好vim是必备技能!下面罗列一些vim的常用操作,用做备忘(不断更新): ...
- vue怎么样创建组件呢??
我知道vue中核心就是组件,但是组件是什么呢?组件有什么用呢?怎么用组件呢?怎么样创建自己的组件呢? 前面两个问题就不说了,这里来说说,后面的两个问题: 1)创建自己的组件 通过vue.extend( ...
- iOS App内存优化之 解决UIImagePickerController的图片对象占用RAM过高问题
这个坑会在特定的情况下特别明显: 类似朋友圈的添加多张本地选择\拍照 的图片 并在界面上做一个预览功能 由于没有特别的相机\相册需求,则直接使用系统自带的UIImagePickerController ...