基本概念

明白

Generator函数是ES 6供应的一种异步编程解决方案。从语法上，能够将Generator函数明白为一个状况机，它封装了多个内部状况。实行Generator函数会返回一个遍历器对象，也就是说Generator函数除了是一个状况机，照样一个遍历器对象天生函数。返回的遍历器对象，能够顺次遍历Generator函数内部的每个状况。

为何运用

Generator最大的优点就是函数能够被停息实行并坚持上下文，这个运转体式格局在处置惩罚那些须要停息的使命时异常有效，而被保持的上下文是为了在未来对运转环境举行恢复。

语法

Generator函数

Generator函数以function *说明开首，并在须要停息运转的处所增添yield关键字

function* myGenerator(){
    // A
    yield 'foo'
    // B
}

实行上面的myGenerator要领会建立一个Generator对象，我们能够经由过程next要领来掌握函数实行。运转next要领会实行myGenerator函数中的代码，直到遇到下一个yield表达式（实行完yield才停息），此时yield后的表达式的值就被返回出去了，而且myGenerator的实行就停息了,当我们再次运转next要领时，myGenerator会在上次停息的处所接着向下运转。

const g = myGenerator()

const state01 = g.next() // {value: 'foo', done: false}
const state02 = g.next() // {value: undefined, done: true}

yield

yield是伴随着Generator函数涌现的，它许可我们返回多个值(多个状况)。然则我们只能在Generator中才运用它。假如我们尝试在回调函数顶用yield一个值，纵然在Generator函数内部声明的，也会抛出毛病

yield*

yield*是用来在一个Generator函数内部挪用另一个Generator函数的

function* foo(){
    yield 'foo'
}
function* bar(){
    yield 'bar'
    yield* foo()
    yield 'bar again'
}

const b = bar()
b.next() // {value: 'bar', done: false}
b.next() // {value: 'foo', done: false}
b.next() // {value: 'bar again', done: false}
b.next() // {value: undefined, done: true}

遍历

因为Generator要领会返回一个遍历器对象(可遍历对象)，因而我们能够运用一个遍历要领，比方for-of遍历该对象内部的一切状况（值）

• for-of遍历

// 接上一个的例子
for (let e of bar()) {
    console.log(e)
}
/* 顺次输出
bar
foo
bar again
*/

注重，b对应的遍历器对象已遍历终了，因而下面的例子只会输出undefined
for (let e of b) {
    console.log(e)
}
// undefined 

• 解构运算完成遍历

console.log([...bar()]) // ['bar', 'foo', 'bar again']

return

我们能够在Generator函数中增添return语句

function* myGenerator(){
    yield 'foo'
    yield 'bar'
    return 'done'
}

var g = myGenerator()

g.next() // {value: 'foo', done: false}
g.next() // {value: 'bar', done: false}
g.next() // {value: 'done', done: true}
g.next() // {value: undefined, done: true}

然则假如运用for-of或许解构运算来遍历遍历器对象，则return背面的值将被疏忽

for(let e of myGenerator()) {
    console.log(e)
}
// foo
// bar


console.log([...myGenerator])
// ['foo', 'bar']

参考资料

ES6 Generator 探秘

ECMAScript 6 入门