ES6 generator函数
generator-生成器
genrat-生成
普通函数——一路到底
generator函数——中间能停
本质上是将其一个函数切割成几个小型函数，然后通过next请求执行
generator标志*，即：function *show(){}
yield;//暂时放弃执行
function *show(){
alert("A")
yield;//暂时放弃执行
alert("B")
}
let genObj=show();
genObj.next();
genObj.next();
yield：既可以传递参数
function *show(num1 ,num2){
alert("A")
alert(`${num1},${num2}`) //100,444
let a = yield;//暂时放弃执行
alert("B")
alert(a); //11
}
let gen = show(100,444);
gen.next(12);//第一个.next没办法给yield传参
gen.next(11);
yield又可以返回值
function *show(){
alert("aaa");
yield 1222;
alert("bbbbb");
return 55;
}
let gen = show();
let re1 = gen.next();
console.log(re1); //{value: 1222, done: false}
let re2 = gen.next();
console.log(re2); //{value: 55, done: true}
generator 实例
generator 好处就像写同步操作一样写异步操作
runner(function *(){
let data1 = yield $.ajax({url:'1.txt',dataType:'json '});
let data2 = yield $.ajax({url:'2.txt',dataType:'json'});
let data3 = yield $.ajax({url:'3.txt',dataType:'json'});
console.log(data1,data2,data3);
})
异步操作：
1.回调
2.Promise
3.generator
//回调
$.ajax({
url:xxx,
dataType:'json;,
success(data1){
$.ajax({
url:xxx,
dataType:'json;,
success(data2){
$.ajax({
url:xxx,
dataType:'json;,
success(data3){
//完事
},
error(){
alert("错了")
}
})
},
error(){
alert("错了")
}
})
},
error(){
alert("错了")
}
})
//Promise
Promise.all([
$.ajax({url:"xxx",dataType:"json"}),
$.ajax({url:"xxx",dataType:"json"}),
$.ajax({url:"xxx",dataType:"json"}),
$.ajax({url:"xxx",dataType:"json"}),
]).then(result=>{
//完事
},err=>{
alert('错了')
});
//generator适合掺杂一些逻辑
runner(function *(){
let data1=$.ajax({url:"xxx",dataType:"json"}),
let data2=$.ajax({url:"xxx",dataType:"json"}),
let data3=$.ajax({url:"xxx",dataType:"json"}),
let data4=$.ajax({url:"xxx",dataType:"json"}),
//完事
})
带逻辑-普通函数
$.ajax({
url:”getUserData“,
dataType:"json",
success(results){
let userData=results[0];
if(userData.type=="VIP“){
$.ajax({
url:'getVIPItems',
dataType:'json',
success(items){
//处理一些事情,生成列表。显示等
},error(){
alert('报错了。。')
}
})
}else{
$.ajax({
url:'getItems',
dataType:'json',
success(items){
//处理一些事情
},error(){
alert('报错了。。')
}
})
}
},
error(){
alert("出错了。。。。“)
}
})
带逻辑-Promise
Promise.all({
$.ajax({url:'getUserData',dataType:'json'})
}).then(result=>{
let userData=results[0];
if(userData.type=="VIP“){
$.ajax({
url:'getVIPItems',
dataType:'json',
success(items){
//处理一些事情
},error(){
alert('报错了。。')
}
})
} else{
$.ajax({
url:'getItems',
dataType:'json',
success(items){
//处理一些事情
},error(){
alert('报错了。。')
}
})
}
},err=>{
allert('失败‘)；
})
带逻辑-generator
不能写成箭头形式
runner(funciton *(){
let userData=yield $.ajax({
url:"getUserData",
dataType:"json",
});
if(userData.type=='VIP'){
let items = yield $.ajax({
url:"getVIPItems",
dataType:"json",
});
}else{
let items = yield $.ajax({
url:"getItems",
dataType:"json",
});
}
//做一些其他的事情。。。。
});
Promise——适合一次读一堆
generator——带逻辑性
generator——KOA
*nodejs
