1.next()、throw()、return() 的共同点

next()throw()return()这三个方法本质上是同一件事,可以放在一起理解。它们的作用都是让 Generator 函数恢复执行,并且使用不同的语句替换yield表达式。

①next()是将yield表达式替换成一个值。

const g = function* (x, y) {
let result = yield x + y;
return result;
}; const gen = g(1, 2);
gen.next(); // Object {value: 3, done: false} gen.next(1); // Object {value: 1, done: true}
// 相当于将 let result = yield x + y
// 替换成 let result = 1;

上面代码中,第二个next(1)方法就相当于将yield表达式替换成一个值1。如果next方法没有参数,就相当于替换成undefined

throw()是将yield表达式替换成一个throw语句。

gen.throw(new Error('出错了')); // Uncaught Error: 出错了
// 相当于将 let result = yield x + y
// 替换成 let result = throw(new Error('出错了'));

return()是将yield表达式替换成一个return语句。

gen.return(2); // Object {value: 2, done: true}
// 相当于将 let result = yield x + y
// 替换成 let result = return 2;

2.一个 Generator 函数里面执行另一个 Generator 函数,需要用到yield*表达式

function* foo() {
yield 'a';
yield 'b';
}

从语法角度看,如果yield表达式后面跟的是一个遍历器对象,需要在yield表达式后面加上星号,表明它返回的是一个遍历器对象。这被称为yield*表达式。


function* bar() {
yield 'x';
yield* foo();
yield 'y';
} // 等同于
function* bar() {
yield 'x';
yield 'a';
yield 'b';
yield 'y';
} // 等同于
function* bar() {
yield 'x';
for (let v of foo()) {
yield v;
}
yield 'y';
} for (let v of bar()){
console.log(v);
}
// "x"
// "a"
// "b"
// "y"

任何数据结构只要有 Iterator 接口,就可以被yield*遍历

function* gen(){
yield* ["a", "b", "c"];
} gen().next() // { value:"a", done:false } let read = (function* () {
yield 'hello';
yield* 'hello';
})(); read.next().value // "hello"
read.next().value // "h"

上面代码中,yield命令后面如果不加星号,返回的是整个数组,加了星号就表示返回的是数组的遍历器对象

上面代码中,yield表达式返回整个字符串,yield*语句返回单个字符。因为字符串具有 Iterator 接口,所以被yield*遍历

如果被代理的 Generator 函数有return语句,那么就可以向代理它的 Generator 函数返回数据

function* foo() {
yield 2;
yield 3;
return "foo";
} function* bar() {
yield 1;
var v = yield* foo();
console.log("v: " + v);
yield 4;
} var it = bar(); it.next()
// {value: 1, done: false}
it.next()
// {value: 2, done: false}
it.next()
// {value: 3, done: false}
it.next();
// "v: foo"
// {value: 4, done: false}
it.next()
// {value: undefined, done: true}

上面代码在第四次调用next方法的时候,屏幕上会有输出,这是因为函数fooreturn语句,向函数bar提供了返回值。

yield*命令可以很方便地取出嵌套数组的所有成员

function* iterTree(tree) {
if (Array.isArray(tree)) {
for(let i=0; i < tree.length; i++) {
yield* iterTree(tree[i]);
}
} else {
yield tree;
}
} const tree = [ 'a', ['b', 'c'], ['d', 'e'] ]; for(let x of iterTree(tree)) {
console.log(x);
}
// a
// b
// c
// d
// e

3.Generator 函数的this

生成一个空对象,使用call方法绑定 Generator 函数内部的this,就是将obj换成F.prototype,再将F改成构造函数,就可以对它执行new命令了,构造函数调用以后,这个F.prototype就是 Generator 函数的实例对象了

function* gen() {
this.a = 1;
yield this.b = 2;
yield this.c = 3;
} function F() {
return gen.call(gen.prototype);
} var f = new F(); f.next(); // Object {value: 2, done: false}
f.next(); // Object {value: 3, done: false}
f.next(); // Object {value: undefined, done: true} f.a // 1
f.b // 2
f.c // 3

备注:文中多数内容摘自阮一峰老师文章,仅供自我学习查阅。

ES6基础知识(Generator 函数)的更多相关文章

  1. 转: ES6异步编程:Generator 函数的含义与用法

    转: ES6异步编程:Generator 函数的含义与用法 异步编程对 JavaScript 语言太重要.JavaScript 只有一根线程,如果没有异步编程,根本没法用,非卡死不可. 以前,异步编程 ...

  2. ES6中的Generator函数

    今天小编发现一个es6中的新概念,同时也接触到了一个新关键字yeild,下面我就简单和大家聊聊es6中的generator函数.大家还可以关注我的微信公众号,蜗牛全栈. 一.函数声明:在functio ...

  3. ES6基础知识(Generator 函数应用)

    1.Ajax 是典型的异步操作,通过 Generator 函数部署 Ajax 操作,可以用同步的方式表达 function* main() { var result = yield request(& ...

  4. ES6基础知识(async 函数)

    1.async 函数是什么?一句话,它就是 Generator 函数的语法糖. const fs = require('fs'); const readFile = function (fileNam ...

  5. ES6 - Note7:Generator函数

    Generator函数 1.Generator函数是ES6增加的异步编程解决方案之一,与普通的函数行为完全不同,类似于一个状态机,内部封装了多个状态. 在函数定义的形式上,跟普通函数差不多,有两处不同 ...

  6. ES6入门之Generator函数

    Generator Generator函数是ES6提供的一种异步编程解决方案,Generator函数是一个状态机,封装了多个内部状态. 执行Generator函数会返回一个遍历器对象,也就是说,Gen ...

  7. es6基础知识

    1.超引用:(...) 用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中 function fun(...args){ console.log(args); //[1,2,3,4,5,6] ar ...

  8. php面试笔记(5)-php基础知识-自定义函数及内部函数考点

    本文是根据慕课网Jason老师的课程进行的PHP面试知识点总结和升华,如有侵权请联系我进行删除,email:guoyugygy@163.com 在面试中,考官往往喜欢基础扎实的面试者,而函数相关的考点 ...

  9. [C/C++基础知识] main函数的参数argc和argv

    该篇文章主要是关于C++\C语言最基础的main函数的参数知识,是学习C++或C语言都必备的知识点.不知道你是否知道该知识?希望对大家有所帮助.一.main()函数参数通常我们在写主函数时都是void ...

随机推荐

  1. Redis之品鉴之旅(五)

    Redis事务 原子性:就是最小的单位 一致性:好多命令,要么全部执行成功,要么全部执行失败 隔离性:一个会话和另一个会话之间是互相隔离的 持久性:执行了就执行了,数据保存在硬盘上 典型例子:银行转账 ...

  2. Vite插件开发纪实:vite-plugin-monitor(下)

    前言 上一篇介绍了Vite启动,HMR等时间的获取. 但各阶段详细的耗时信息,只能通过debug的日志获取 本文就实现一下debug日志的拦截 插件效果预览 --debug做了什么 项目启动指令 vi ...

  3. Django整理(一) - 项目和应用创建及运行

    一.项目组织结构     · 一个Project包含有多个App     · 一个App就是一个Python包,就代表一个功能模块,比如: 用户模块,商品模块等 .各个功能模块间可以保持相对的独立 . ...

  4. 使用CEF(四)— 在QT中集成CEF(1):基本集成

    QT作为C++下著名的跨平台软件开发框架,实现了一套代码可以在所有的操作系统.平台和屏幕类型上部署.我们前几篇文章讲解了如何构建一款基于CEF的简单的样例,但这些样例的GUI都是使用的原生的或者是控件 ...

  5. bzoj4094 && luogu3097 最优挤奶

    题目大意: 给定n个点排成一排,每个点有一个点权,有m次修改,每次改变某个点的点权并将最大点独立集计入答案,输出最终的答案 其中\(n\le 40000\ , \ m\le 50000\) QWQ说实 ...

  6. 新一代数据科学ide平台DataSpell提前发行版体验

    1 简介 PyCharm开发公司jetbrains专门面向数据科学的ide项目DataSpell在前不久发布了其EAP版本(早期预览版本),为我们带来了诸多趋于成熟的功能特性,本文就将为大家介绍其使用 ...

  7. aritest发送测试报告到邮件

    #!/usr/bin/env python # -*- coding=utf-8 -*- __CreateAt__ = '2020/4/19-17:34' import shutil from air ...

  8. 航胥:北航教务助手——Alpha阶段发布声明

    本软件项目为北京航空航天大学2020年"软件工程"课程项目 v1.0.5版本下载地址:https://bhpan.buaa.edu.cn:443/#/link/D10B71B69E ...

  9. 【二食堂】Alpha - Scrum Meeting 6

    Scrum Meeting 6 例会时间:4.16 11:40 - 12:10 进度情况 组员 昨日进度 今日任务 李健 1. 文本区域进度40%,UI需要进行调整issue 1. 继续文本区域的开发 ...

  10. OO第三单元——JML规格化设计

    OO第三单元--JML规格化设计 JML语言的理论基础以及应用工具链情况 理论基础 JML是对JAVA程序进行规格化设计的一种表示语言,是一种行为接口规格语言.JML整合了Java和JAVAdoc,并 ...