1、generator 生成器函数简介
(1)普通函数,一路执行到底
(2)generator函数,中间可以停,到哪停呢,用 yield 配合,交出执行权。
yield 有放弃、退让、退位的意思。
需要调用next()方法启动执行,需要遇到 yield 停, 踹一脚走一步
generator函数前面加一个 * 两边可以有空格,或靠近函数或function
实际生成多个小函数,实现走走停停的效果。
function show() {
console.log('a')
console.log('b')
}
show() // 普通函数
//输出结果 1 2
//生成器函数
function *show2() {
console.log('1')
yield //具体是啥下面有解释
console.log('2')
}
let genObj = show2()
genObj.next() // 1
genObj.next() // 2
genObj.next() // 最后了,没有结果
2、generator-yield到底是什么?
(1)yield
① 既可传参,又可以返回
② 第一个next()传参无效,也接收不到的,只用来启动
(2)如果函数前漏掉 *
① 就是普通函数
② 如果有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返回
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
})
4、generator的用途
在JavaScript中,一个函数一旦被执行,就会执行到最后或者被return,运行期间不会被外部所影响打断,而generator的出现就打破了这种函数运行的完整性。
5、asnyc await
ES2017标准引入了asnyc函数,使得异步操作变得更加方便。其实asnyc 是generator函数的语法糖。