(相关资料图)
一、生成器函数声明与调用
生成器就是一个特殊的函数,用于异步编程。
常见的异步操作:文件操作、网络操作(ajax
,request
)、数据库操作等。
我们之前对异步编程使用的是纯回调函数。生成器就是对异步编程的一种解决方案。
1.声明方式
function * fn(){ console.log("Hello generator");}
2.执行方式
let iterator = fn();//必须调用next()方法才能执行iterator.next();
在生成器函数中可以执行yield
语句;
yield
关键词函数代码的分隔符,将一个函数代码分成几段,一段段的执行,可以让生成器停止和开始执行。
function * fn(){ console.log(111); yield"一直没有耳朵";//一段 console.log(222); yield"一直没有尾巴";//一段 console.log(333); yield"真奇怪";//一段 console.log(444);}//一段
二、生成器函数参数传递
function * fn(arg){ console.log(arg); let one = yield 111; console.log(one); yield 111; yield 222; yield 333;}let iterator = fn("AAA");//next方法可以传入实参console.log(iterator.next());//value:111,done:false//next传入的实参将作为上一个yield语句的返回结果console.log(iterator.next("BBB"));
三、生成器函数实例
异步编程
1.要求:1s
后控制台输出111,2s
后输出222,3s
后输出333;
//使用定时器操作(回调地狱)setTiemout(() =>{ console.log(111); setTiemout(() =>{ console.log(222); setTiemout(() =>{ console.log(333); },3000) },2000)},1000)
使用生成器函数来实现:
//使用生成器函数function one(){ setTimeout(()=>{ console.log(111); iterator.next();//让它能够继续走下去 },1000)}function two(){ setTimeout(()=>{ console.log(222); iterator.next(); },2000)}function three(){ setTimeout(()=>{ console.log(333); iterator.next(); },3000)}function * gen(){ yield one(); yield two(); yield three();}//调用生成器函数let iterator = gen();iterator.next();
2.模拟获取用户数据、订单数据、商品数据;
function getUsers(){ setTimeout(()=>{ let data = "用户数据"; //调用next方法,并将数据传入 iterator.next(data); },1000)}function getOrders(){ setTimeout(()=>{ let data = "订单数据"; iterator.next(data); },1000)}function getGoods(){ setTimeout(()=>{ console.log("商品数据"); iterator.next(data); },1000)}function * gen(){ let users = yield getUsers(); console.log(users); let orders = yield getOrders(); console.log(orders); let goods = yield getGoods(); console.log(goods);}//调用生成器函数let iterator = gen();iterator.next();