ES6新特性--Generator

Generator 函数：1.可以理解成状态机，2.理解成协程(中断一个函数的执行)

		// generator 初体验
		/*
		  写法上：
		     1 在函数上加上*号
			 2 在函数中加上yield

			 
			 刚开始的时候，函数是不执行的。
			      当next()调用时候，对应着执行到一个yield。再调用next()，再执行到下一个。
		*/
		function *myGen(){
		    console.log('aaaa')
			yield
			console.log('bbbb')
			yield
			console.log('cccc')
		}
		
		const mg = myGen();
		console.log(mg)
		mg.next()
		mg.next()
		mg.next()





        // 语法糖 for-of
	    function *myGen2(){
		    console.log('myGen2-aaaa')
			yield 'a执行完了'
			console.log('myGen2-bbbb')
			yield 'b执行完了'
			console.log('myGen2-cccc')
		}
		
		const mg2 = myGen2();
		for( let i of  mg2){
		    console.log(i)
		}
		

1. yield后面跟着参数

		// yield后面跟着参数


        /*
           写法：
           1 yield后面跟着参数：params
           2 const mgsResult = mg3.next();
             console.log(mgsResult)   //步骤一
             通过接收next()方法的返回值，拿到yield后面的参数
        */
		function *myGen3(){
		    console.log('myGen3-执行1')
			yield '步骤一'
			console.log('myGen3-执行2')
			yield '步骤二'
			console.log('myGen3-执行3')
			yield '步骤三'
		}
		
		const mg3 = myGen3();
		
		const mgsResult = mg3.next();
		console.log(mgsResult)   //步骤一
		
		const mgsResult2 = mg3.next();
		console.log(mgsResult2)  //步骤二
		
		const mgsResult3 = mg3.next();
		console.log(mgsResult3)  //步骤三
		
		const mgsResult4 = mg3.next();
		console.log(mgsResult4)

2. next() 传递参数，Generator接收参数

         /*
           写法：
           1 mg4.next('111')  next()方法传递参数
           2 let res1 = yield '步骤一'
             console.log(res1)
             在generator的res1中收到参数
        */
		function *myGen4(){
		
		   // 步骤一....代码
		   let res1 = yield '步骤一'
		   console.log(res1)   // 222
		   
		   // 步骤二....代码
		   let res2 = yield '步骤二'
		   console.log(res2)   // 333
		   
		   // 步骤三....代码
		   let res3 = yield '步骤三'
		   console.log(res3)  // 444
		}
		
		const mg4 = myGen4();
		// 遇到yield就停止了，这个时候，yield后面的能拿出来。但是赋值操作不会执行
		// 所以打印不出来'111'
		const mg4Result1 = mg4.next('111')
		const mg4Result2 = mg4.next('222')
		const mg4Result3 = mg4.next('333')
		const mg4Result4 = mg4.next('444')

         // 小例子：实现一个异步操作的链式调用。
		// 即调用完apiA后，拿到返回值。用这个返回值作为参数，调用apiB




        // 模拟api
		function AsyncOprate(){
		    return new Promise((resolve,reject)=>{
			     /*
				    耗时操作中
				 */
			     resolve('成功')
			})
		}
		
		
		function *myGen5(){
		    const res1 =  yield AsyncOprate()
			console.log('generator',res1)
			// res1 即是apiA的返回值，这个时候我们请求apiB
			yield AsyncOprate(res1)
		}
		
		const mg5 = myGen5();
		
		// 获取yield后面的值
		const yieldResult1 = mg5.next();
		console.log(yieldResult1)
		
		yieldResult1.value.then(res=>{
		     // 拿到apiA的返回值
		     console.log(res)
			 // 把返回值传到generator中
			 mg5.next(res)
			 
			 // 执行完成
			 mg5.next()
		})
		
		
		

		// 一般这种情况是不会用这个的，现在处理的方式是async和await

        // async表示，这个函数有异步操作
		// await，让异步代码同步执行，后面跟着的是promise
		// 注意： wait接受的是resolve(data)的消息，遇到reject(error)以后，整个函数就不执行了。
		// 所以需要一个整体的try catch
		
		
		// 还是刚才的例子 async 和 await会很省事
		async function myFun(){
		
		     // 执行第一个函数，获取结果
		     const res1 = await AsyncOprate();
			 console.log('执行第一个函数返回的结果',res1)
			 
			 // 执行第二个函数，参数是第一个函数的执行结果
			 await AsyncOprate(res1)

		}
		
		myFun()