ES6系列九：generator

一、generator 生成器函数
普通函数，一路到底。
generator函数，中间可以停，到哪停呢，用 yield 配合，交出执行权。
yield 有放弃、退让、退位的意思。
需要调用next()方法启动执行，需要遇到 yield 停，踹一脚走一步。
generator函数前面加一个 * 两边可以有空格，或靠近函数或function
背后实际生成多个小函数，实现走走停停。

function show() {
    console.log('a')
    console.log('b')
}
show()  // 普通函数

function *show2() {
    console.log('1')
    yield  //暂停
    console.log('2')  //需要调用next()方法启动执行
}
let genObj = show2()
genObj.next()  // 结果：1
genObj.next()  // 结果：2
genObj.next()  // 最后了，没有结果

二、generator yield
yield
既可传参，又可以返回。
第一个next()传参无效，只用来启动。
如果函数前漏掉 *
就是普通函数。
如果有yield会报错， ReferenceError: yield is not defined。
yield 只能在Generator函数内部使用。

function * show() {
    console.log('1')
    var a = yield
    console.log('2')
    console.log(a)
}
//yield 传参
var gen = show()
gen.next()   //结果：1
gen.next()   //结果：2 和 undefined。因为没有传参，yield没有返回值
var gen = show()
gen.next(10)   //结果：1。 第一次执行到yield，但没有执行赋值
gen.next(20)   //结果：2 和 20


function* show2() {
    console.log('1')
    yield 10
    console.log('2')
}
// yield 返回
var gen = show2()
var res1 = gen.next()
console.log(res1)   //{ value: 10, done: false }
var res2 = gen.next()
console.log(res2)   //{ value: undefined, done: true } 最后的value需要return返回

三、generator实例
Promise 适合一次读一组。
generator 适合逻辑性的。

// 带逻辑-generator
runner(function * () {
    let userData = yield $.ajax({url: 'getUserData'})
    if (userData.type == 'VIP') {
        let items = yield $.ajax({url: 'getVIPItems'})
    } else {
        let items = yield $.ajax({url: 'getItems'})
    }
})

// yield 实例，用同步方式写异步
server.use(function * () {
    let data = yield db.query(`select * from user_table`)
    this.body = data
})

ES6系列九：generator

猜你喜欢