介绍

Generator函数是 ES6 提供的一种异步编程解决方案, async是该方案的语法糖

核心语法

Generator对象由生成器函数返回, 并且它符合可迭代协议和迭代器协议

生成器函数在执行时能暂停, 后面又从暂停处继续执行

<script>// 1.定义生成器函数function* testGenerator() {console.log('生成器对象执行了');yield '异步任务1'yield '异步任务2'yield '异步任务3'}// 2.获取Generator对象const test = testGenerator()// 3.next()方法// 手动执行console.log(test.next()); // 生成器对象执行了 / {value: '异步任务1', done: false}console.log(test.next()); // {value: '异步任务2', done: false}console.log(test.next()); // {value: '异步任务3', done: false}console.log(test.next()); // {value: 'undefiend', done: true}// 4.for of循环// 循环执行for (const item of testGenerator()) {console.log(item);}</script>

管理异步

使用Generator对象管理异步任务, 在定义的时候比较直观, 但是调用还是比较繁琐, 所以才会出现async语法糖

<script>// 1.创建一个生成器function* cityGenerator() {yield fetch('http://hmajax.itheima.net/api/city?pname=北京');yield fetch('http://hmajax.itheima.net/api/city?pname=天津');}// 2.获取生成器对象const city = cityGenerator();// 3.通过netx方法执行代码city.next().value.then((res)=>{// 4.拿到第一个任务的成功结果console.log('res', res.json());// 5.执行下一个异步任务return city.next().value}).then((res)=>{// 6.拿到第一个任务的成功结果console.log('res', res.json());})</script>