es6 Generator生成器

了解

使用 加*

function* funColors(){
	console.log('--start--')
	yield 'red'
	console.log('--red-green--')
	yield 'green'
	console.log('--green-blue--')
	yield 'blue'
	console.log('--end--')
} 
let colors = funColors()
colors.next();// 返回的是 遍历器 iterator

添加运算

function* funColors(){
    let i = 0
    yield i
    i+=10
    yield i
    i+=10
    yield i
    i+=10
} 
let colors = funColors()

colors状态 为

执行 colors.next()

colors状态 为

应用 控制ajax工作流

function* stops(){
	let users = yield ajax('users and')
	let Firstuser = yield ajax(users+' Firstuser and')
	let owers = yield ajax(Firstuser+'  owers')
	consolr.log(owers)
}
function ajax(url){
	 // setTimeout作用 异步
	 // 避免 Uncaught TypeError: Generator is already running 上一次的next尚未结束，又开始了新的一次next
	 setTimeout(()=>{
          console.log('ajax:',url)
          stu.next(url)
     },0)
     //axios.get(url).then(res=>stu.next(res.data))
}
let stu = stops()
stu.next()

// 流程解析
// stu.next()
// 执行第一个 yield ajax('users and')
// 进入ajax 
// console.log('ajax:',url); ajax: users and

// 暂停函数 第一个 .next() 执行完成

// 执行stu.next(url); //
// 把 [yield ajax('users and') == url] 赋值给 users 
// 执行第二个 yield ajax(users+' Firstuser and')
// 进入ajax 
// console.log('ajax:',url); //ajax: users and Firstuser and

// 暂停函数 第二个 .next() 执行完成

// 执行stu.next(url)
// 把[yield ajax(users+' Firstuser and') == url] 赋值给 Firstuser 
// 执行第三个 yield ajax(Firstuser+'  owers')
// 进入ajax 
// console.log('ajax:',url); //ajax: users and Firstuser and owers
// 暂停函数 第三个 .next() 执行完成

// 执行stu.next(res.data)
// 把[yield ajax(Firstuser+'  owers') == url] 赋值给 owers 
// consolr.log(owers);//users and Firstuser and owers
// 第四个 .next() 执行完成