石川es6课程---13-16、generator-认识生成器函数

一、总结

一句话总结：

` generator函数，中间可以停，到哪停呢，用 yield 配合，交出执行权

` 需要调用next()方法启动执行，需要遇到 yield 停, 踹一脚走一步

` generator函数前面加一个 * 两边可以有空格，或靠近函数或function：function *show2() {

` 背后实际生成多个小函数，实现走走停停

function show() {console.log('a')console.log('b')
}
show() // 普通函数function *show2() {console.log('1')yieldconsole.log('2')
}
let genObj = show2()
genObj.next() // 1
genObj.next() // 2
genObj.next() // 最后了，没有结果

1、generator-yield是啥？

- yield既可传参，又可以返回

- 第一个next()传参无效，只用来启动

- 如果函数前漏掉 *，就是普通函数，如果有yield会报错， ReferenceError: yield is not defined

function * show() {console.log('1')var a = yieldconsole.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 和 20function* show2() {console.log('1')yield 10console.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返回

2、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
})

二、generator-认识生成器函数

1.generator-认识生成器函数

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

function show() {console.log('a')console.log('b')
}
show() // 普通函数function *show2() {console.log('1')yieldconsole.log('2')
}
let genObj = show2()
genObj.next() // 1
genObj.next() // 2
genObj.next() // 最后了，没有结果

2.generator-yield是啥

• yield

  • 既可传参，又可以返回
  • 第一个next()传参无效，只用来启动

• 如果函数前漏掉 *

  • 就是普通函数
  • 如果有yield会报错， ReferenceError: yield is not defined
  • yield 只能在Generator函数内部使用

function * show() {console.log('1')var a = yieldconsole.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 和 20function* show2() {console.log('1')yield 10console.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返回

3.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
})

三、generator 生成器，函数

generator 生成器，函数

• 普通函数
  • 一路到底
• generator函数
  • 中间能暂停
• 使用场景
  • 请求数据

  function 函数(){//codeajax(xx,function(){//code回调方式})//code
  }
  function *函数(){//codeyield ajax(xxx)//yield将整个生成函数分割成若干个普通小函数，通过next()依次执行函数//code
  }
  

yield

• 传参

        function *show(){alert(1)let a=yieldalert(2)}let gen=show()//如果第一个next想要传参的话直接同正常函数一样function *show(num1,num2){alert(`${num1},${num2}`)alert(1)let a=yieldalert(2)}let gen=show()let gen=show(99,88)gen.next(12)//第一个next没法给yield传参gen.next(5)

• 返回

        function *show(){alert('a')yield 12alert('b')}let gen=show()res1=gen.next()console.log(res1)//{value:12,done:false}res2=gen.next()console.log(res2)//{value:undefined(取决于函数体中的return值),done:true}