1、Generator 函数是 ES6 提供的一种异步编程解决方案。形式上,Generator 函数是一个普通函数,但是有两个特征。一是,function关键字与函数名之间有一个星号;二是,函数体内部使用yield语句,定义不同的内部状态。

2、Generator函数的调用方法与普通函数一样,也是在函数名后面加上一对圆括号。不同的是,调用Generator函数后,该函数并不执行,返回的也不是函数运行结果,而是一个指向内部状态的指针对象,也就是上一章介绍的遍历器对象(Iterator Object)。

3、必须调用遍历器对象的next方法,使得指针移向下一个状态。也就是说,每次调用next方法,内部指针就从函数头部或上一次停下来的地方开始执行,直到遇到下一个yield语句(或return语句)为止。换言之,Generator函数是分段执行的,yield语句是暂停执行的标记,而next方法可以恢复执行。

4、总结一下,调用Generator函数,返回一个遍历器对象,代表Generator函数的内部指针。以后,每次调用遍历器对象的next方法,就会返回一个有着valuedone两个属性的对象。value属性表示当前的内部状态的值,是yield语句后面那个表达式的值;done属性是一个布尔值,表示是否遍历结束。

5、一个函数里面,只能执行一次(或者说一个)return语句,但是可以执行多次(或者说多个)yield语句。正常函数只能返回一个值,因为只能执行一次return;Generator函数可以返回一系列的值,因为可以有任意多个yield

6、由于Generator函数就是遍历器生成函数,因此可以把Generator赋值给对象的Symbol.iterator属性,从而使得该对象具有Iterator接口。

var myIterable = {};
myIterable[Symbol.iterator] = function* () {
yield 1;
yield 2;
yield 3;
}; [...myIterable] // [1, 2, 3]

7、yield句本身没有返回值,或者说总是返回undefinednext方法可以带一个参数,该参数就会被当作上一个yield语句的返回值。

8、下面是一个利用Generator函数和for...of循环,实现斐波那契数列的例子。

function* fibonacci() {
let [prev, curr] = [0, 1];
for (;;) {
[prev, curr] = [curr, prev + curr];
yield curr;
}
} for (let n of fibonacci()) {
if (n > 1000) break;
console.log(n);
}

9、除了for...of循环以外,扩展运算符(...)、解构赋值和Array.from方法内部调用的,都是遍历器接口。这意味着,它们都可以将Generator函数返回的Iterator对象,作为参数。

function* numbers () {
yield 1
yield 2
return 3
yield 4
} // 扩展运算符
[...numbers()] // [1, 2] // Array.from 方法
Array.from(numbers()) // [1, 2] // 解构赋值
let [x, y] = numbers();
x //
y // // for...of 循环
for (let n of numbers()) {
console.log(n)
}
//
//

js-ES6学习笔记-Generator函数的更多相关文章

  1. JS&ES6学习笔记(持续更新)

    ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...

  2. es6学习笔记-async函数

    1 前情摘要 前段时间时间进行项目开发,需求安排不是很合理,导致一直高强度的加班工作,这一个月不是常说的996,简直是936,还好熬过来了.在此期间不是刚学会了es6的promise,在项目有用到pr ...

  3. es6学习笔记6--Generator 函数

    基本概念 Generator函数有多种理解角度.从语法上,首先可以把它理解成,Generator函数是一个状态机,封装了多个内部状态. 执行Generator函数会返回一个遍历器对象,也就是说,Gen ...

  4. js-ES6学习笔记-Generator函数的异步应用

    1.ES6 诞生以前,异步编程的方法,大概有下面四种. 回调函数 事件监听 发布/订阅 Promise 对象 Generator 函数将 JavaScript 异步编程带入了一个全新的阶段. 2.所谓 ...

  5. js-ES6学习笔记-Generator函数的应用

    1.异步操作的同步化表达 Generator函数的暂停执行的效果,意味着可以把异步操作写在yield语句里面,等到调用next方法时再往后执行.这实际上等同于不需要写回调函数了,因为异步操作的后续操作 ...

  6. es6学习笔记--箭头函数

    基本用法 ES6允许使用“箭头”(=>)定义函数. var f = v => v; 上面的箭头函数等同于: var f = function(v) { return v; }; 如果箭头函 ...

  7. ES6学习笔记之函数(二)

    5.作用域 使用默认参数时,参数会形成一个独立的作用域,此作用域与函数体中的作用域是平行关系,互不影响. var x = 1; function show(x, y= function () { x= ...

  8. ES6学习之Generator函数

    概念:可以把Generator 函数理解成状态机(封装了多个内部状态)或者是一个遍历器对象生成函数 写法:Generator函数的定义跟普通函数差不多,只是在function关键字后面加了一个星号 f ...

  9. ES6学习笔记(函数)

    1.函数参数的默认值 ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面. function log(x, y = 'World') { console.log(x, y); } log(' ...

随机推荐

  1. 01-Python的基础知识3

    - 数字 - 数字常量: - 整型: - 概念: - 指代平常数学上的整数常量.Python中整型指代int类型. - 基本运算: - 可以执行平常的+,-,*,/ ,%以及其他操作 假设a=15,b ...

  2. js转换数据格式为货币格式

    有时候输资金数据的时候如果位数较多就不好读了,如果输完能转换一下格式,转成用“,”隔开的通用格式就比较好看了.自己写了一个备用,以后用到的话就不用再写了. //将数字转换为货币格式,用,隔开 func ...

  3. 菜鸟--shell脚本编写之解决问题篇

    一.执行时发现adb shell进入设备后不再继续往下执行了 adb shell cd /system/plugin/....exit 在网上查到的都是bat文件调用adb shell,没有sh文件调 ...

  4. C# 多线程五之Task(任务)一

    1.简介 为什么MS要推出Task,而不推Thread和ThreadPool,以下是我的见解: (1).Thread的Api并不靠谱,甚至MS自己都不推荐,原因,它将整个Thread类都不开放给Win ...

  5. linux下利用dd命令测试磁盘读写速度

    在Linux中,dd命令用于读取.转换和输出数据,它可从标准输入或文件中读取数据并输出到指定文件或标准输出中.该命令使用参数如下: 其中”=“后面的为设置的参数 If = <文件名>  : ...

  6. Android的几种弹出框

    项目效果图: 新建一个项目,结构图如下所示: activity_main.xml: <?xml version="1.0" encoding="utf-8" ...

  7. 一口一口吃掉Hexo(四)

    如果你想得到更好的阅读效果,请访问我的个人网站 ,版权所有,未经许可不得转载! 人总是不会满足于现状,接下来我们就可以让我们的朋友们通过独立域名访问我们的网站了,但是这肯定是要花点钱的,所以这篇文章难 ...

  8. Javac中的nullcheck

    Javac会通过调用引用对象的getClass()来判空,主要有几处: (1)JCMethodInvocation()方法中,如下实例: class A{ class B{} } public cla ...

  9. JavaScript -- Form

    -----048-Form.html----- <!DOCTYPE html> <html> <head> <meta http-equiv="co ...

  10. CSS3 Drop-Shadows效果制作教程分享

    要求 必备知识 基本了解CSS语法,初步了解CSS3语法知识. 开发环境 Adobe Dreamweaver CS6/Chrome浏览器 演示地址 演示地址 Drop-Shadow效果,其实就是大家熟 ...