generator 应用实例
generator与promise应用实例
<!DOCTYPE html>
<html>
<head>
<Meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script src="runner.js"></script>
<script>
runner(function*() {
let ajaxData = yield $.ajax({
url: './ajax.json',
dataType: 'json'
});
console.log(ajaxData);
let ajaxData2 = yield $.ajax({
url: './all.json',
dataType: 'json'
});
console.log(ajaxData2)
})
</script>
</html>
runner.js代码如下
function runner(_gen){
return new Promise((resolve, reject)=>{
var gen=_gen();
_next();
function _next(_last_res){
var res=gen.next(_last_res);
if(!res.done){
var obj=res.value;
if(obj instanceof Promise){
obj.then((res)=>{
_next(res);
}, (err)=>{
reject(err);
});
}else if(typeof obj=='function'){
if(obj.constructor.toString().startsWith('function GeneratorFunction()')){
runner(obj).then(res=>_next(res), reject);
}else{
_next(obj());
}
}else{
_next(obj);
}
}else{
resolve(res.value);
}
}
});
};
我们可以使用同步的方式来处理异步的请求，非常的实用方便，但是可以看到我们使用时需要引入一个文件，有些许的不方便 ，所以官方就有了 async await 使用方法如下
<!DOCTYPE html>
<html>
<head>
<Meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script>
async function ajaxAsync() {
let ajaxData = await $.ajax({
url: './ajax.json',
dataType: 'json'
});
console.log(ajaxData);
let ajaxData2 = await $.ajax({
url: './all.json',
dataType: 'json'
});
console.log(ajaxData2)
}
ajaxAsync();
</script>
</html>
小提示：generator此时使用时是不能用箭头函数的，但是用async时是可以使用的
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
