yield语句

由于Generator函数返回的遍历器对象,只有调用next方法才会遍历下一个内部状态,所以其实提供了一种可以暂停执行的函数。yield语句就是暂停标志。

yield语句只能用在 Generator 函数里面,用在其他地方都会报错。

yield语句如果用在一个表达式之中,必须放在圆括号里面。yield语句用作函数参数或放在赋值表达式的右边,可以不加括号。

function* demo() {
console.log('Hello' + yield); // SyntaxError
console.log('Hello' + yield 123); // SyntaxError console.log('Hello' + (yield)); // OK
console.log('Hello' + (yield 123)); // OK
}
function* demo() {
foo(yield 'a', yield 'b'); // OK
let input = yield; // OK
}

  

next方法的参数

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

function* foo(x) {
var y = 2 * (yield (x + 1));
var z = yield (y / 3);
return (x + y + z);
} var a = foo(5);
a.next() // Object{value:6, done:false}
a.next() // Object{value:NaN, done:false}
a.next() // Object{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 }

  

for...of循环

for...of循环可以自动遍历Generator函数时生成的Iterator对象,且此时不再需要调用next方法。

一旦next方法的返回对象的done属性为true,for...of循环就会中止,且不包含该返回对象。

除了for...of循环以外,扩展运算符(...)、解构赋值和Array.from方法内部调用的,都是遍历器接口。

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 // 1
y // 2 // for...of 循环
for (let n of numbers()) {
console.log(n)
}
// 1
// 2

  

Generator.prototype.return()

Generator函数返回的遍历器对象,还有一个return方法,可以返回给定的值,并且终结遍历Generator函数。

function* gen() {
yield 1;
yield 2;
yield 3;
} var g = gen(); g.next() // { value: 1, done: false }
g.return('foo') // { value: "foo", done: true }
g.next() // { value: undefined, done: true }

  如果Generator函数内部有try...finally代码块,那么return方法会推迟到finally代码块执行完再执行。

这意味着,它们都可以将Generator函数返回的Iterator对象,作为参数。

function* numbers () {
yield 1;
try {
yield 2;
yield 3;
} finally {
yield 4;
yield 5;
}
yield 6;
}
var g = numbers()
g.next() // { done: false, value: 1 }
g.next() // { done: false, value: 2 }
g.return(7) // { done: false, value: 4 }
g.next() // { done: false, value: 5 }
g.next() // { done: true, value: 7 }

  

yield* 语句

在 Generator 函数内部,调用另一个 Generator 函数。

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*遍历。

应用

(1)异步操作的同步化表达

(2)控制流管理

(3)部署Iterator接口

利用Generator函数,可以在任意对象上部署Iterator接口。

function* iterEntries(obj) {
let keys = Object.keys(obj);
for (let i=0; i < keys.length; i++) {
let key = keys[i];
yield [key, obj[key]];
}
} let myObj = { foo: 3, bar: 7 }; for (let [key, value] of iterEntries(myObj)) {
console.log(key, value);
} // foo 3
// bar 7

 对数组部署Iterator接口

function* makeSimpleGenerator(array){
var nextIndex = 0; while(nextIndex < array.length){
yield array[nextIndex++];
}
} var gen = makeSimpleGenerator(['yo', 'ya']); gen.next().value // 'yo'
gen.next().value // 'ya'
gen.next().done // true

  

(4)作为数据结构

es6generator的更多相关文章

  1. ES6-Generator

    Generator 关键词:状态机,遍历器,同步方式写异步方法 基本概念 形式上,Generator函数是一个普通函数,但是有两个特征. function关键字与函数名之间有一个星号. 二是,函数体内 ...

  2. es6- Generator函数实现长轮询

    1.Generator 函数是 ES6 提供的一种异步编程解决方案,语法行为与传统函数完全不同. 语法上,首先可以把它理解成,Generator 函数是一个状态机,封装了多个内部状态.形式上,Gene ...

  3. ES6-Generator使用与改写

    用Generator封装Symbol中的iterator方法: 注意:Generator的function后必须写* config:分别有3个txt文件,两个文件写路径,一个文件写要输出的内容 前置写 ...

  4. ES6-Generator基础用法

    Generator简介: 生成器,本身是函数,执行后返回迭代对象,函数内部要配合yield使用Generator函数会分段执行,遇到yield暂停. 使用Generator注意点:function 和 ...

随机推荐

  1. opencv模板匹配有趣的链接

    https://docs.opencv.org/3.0-beta/doc/py_tutorials/py_imgproc/py_template_matching/py_template_matchi ...

  2. C-Free 5 安装 [Error] G__~1.EXE: (x86)\C-FREE~1\mingw\mingw32\bin\: No such file or directory

    解决[Error] g++.exe: 5\mingw\include: No such file or directory - 陆总的博客 - CSDN博客 https://blog.csdn.net ...

  3. 12.2RAC搭建记录

    12.2RAC环境搭建记录 安装前资源检查 资源限制要求/etc/security/limits.conf Table 6-1 Installation Owner Resource Limit Re ...

  4. LeetCode 682 Baseball Game 解题报告

    题目要求 You're now a baseball game point recorder. Given a list of strings, each string can be one of t ...

  5. LeetCode 509 Fibonacci Number 解题报告

    题目要求 The Fibonacci numbers, commonly denoted F(n) form a sequence, called the Fibonacci sequence, su ...

  6. CF997C Sky Full of Stars 数论

    正解:容斥 解题报告: 传送门! 两个方法,分别港下QAQ 先说第一种 首先要推出式子,就∑2*C(i,n)*(-1)i+1*3i*3n*n-n+3*∑∑(-1)i+j+1*C(i,n)*C(j,n) ...

  7. glove理解

    先贴个看起来讲的不错的文章链接,后续详细看了再补充https://blog.csdn.net/leyounger/article/details/78206832 2018.10.28大概了解了下gl ...

  8. 前端 HTML 常用标签 head标签相关内容 link标签

    link标签 引入CSS样式文件 href="./index.css" CSS文件的路径 <!-- 引入CSS样式文件 --> <link rel="s ...

  9. Github上Laravel开源排行榜Star数61-90名

    Github上Laravel开源排行榜Star数61-90名,罗列所有 Laravel 开源扩展包,含 Github Star 数量,下载数量和项目简介.默认排序是按Star数量从多到少来排 61.c ...

  10. HTTP协议与WEB框架简介

    HTTP协议与WEB框架简介 一.HTTP协议 HTTP简介 HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写,是用于从万维网(WWW:World Wid ...