async和await原理

async和await原理

generator是ES6提出 async和await是ES7提出

async和await的原理就是generator

yield结果有value和done两个属性，遍历完done:true

手写实现

	function* getResult(params) {
	    yield new Promise((resolve, reject) => {
	        setTimeout(() => {
	            resolve(1); console.log(1);
	        }, 1000);
	    })
	    yield new Promise((resolve, reject) => {
	        setTimeout(() => {
	            resolve(2); console.log(2);
	        }, 500);
	    })
	    yield new Promise((resolve, reject) => {
	        setTimeout(() => {
	            resolve(3); console.log(3);
	        }, 100);
	    })
	}
	const gen = getResult()
	gen.next().value.then(() => {
	            gen.next().value.then(() => {
	                gen.next();
	            });
	        });

封装一系列then为一个函数（co函数）

  function co(g) {
	  const nextObj = g.next(); 
	  if (nextObj.done) {
	      return;
	  }
	  nextObj.value.then(() => {
	      co(g)
	  })
	} 
	co(gen)

async 函数对 Generator 函数的改进

体现在以下三点
1）内置执行器。 Generator 函数的执行必须靠执行器，所以才有了 co 函数库，而 async 函数自带执行器。
2）更好的语义。 async 和 await，比起星号和 yield，语义更清楚了。async 表示函数里有异步操作，await 表示紧跟在后面的表达式需要等待结果。
3）更广的适用性。 co 函数库约定，yield 命令后面只能是 Thunk 函数或 Promise 对象，而 async 函数的 await 命令后面，可以跟 Promise 对象和原始类型的值（数值、字符串和布尔值，但这时等同于同步操作）。
4）返回值是promise。这比Generator 返回函数是Iterator对象方便许多，直接可用then实现进一步操作，然后我们就会使用到then的语法糖await命令。