js使用generator函数同步执行ajax任务


Posted in Javascript onSeptember 05, 2017

本文实例为大家分享了js使用generator函数同步执行ajax任务的具体代码,供大家参考,具体内容如下

function request(url, callback) {
  fetch(url, {mode: 'cors', credentials: 'include', headers: new Headers({ 'X-Requested-With': 'XMLHttpRequest' })})
  .then(response => response.text())
  .then(text => {
    console.log(url);
    console.log(text);
    callback(text);
  })
  .catch((e) => console.log(e));
}

var iterator = null;
function getData(src){
  request(src, function(response){
    iterator.next(JSON.parse(response));
  })
}

function getTpl(src){
  request(src, function(response){
    iterator.next(response);
  });
}

// 同步任务
function render(data, tpl){
  for(var i in data) {
    tpl = tpl.replace("${"+i+"}", data[i]);
  }
  return tpl;
}

// 主逻辑
var getArticles = function* (src){
  console.log('begin')
  var data = yield getData(src)
  var tpl = yield getTpl(data.tpl)
  var res = render(data, tpl)
  console.log(res)
}

iterator = getArticles('data.json')
// 开始执行
iterator.next()
// 异步任务模型

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery获取及设置outerhtml的方法
Mar 09 Javascript
JavaScript采用递归算法计算阶乘实例
Aug 04 Javascript
由浅入深讲解Javascript继承机制与simple-inheritance源码分析
Dec 13 Javascript
文件上传,iframe跨域数据提交的实现
Nov 18 Javascript
jQuery中页面返回顶部的方法总结
Dec 30 Javascript
layui前段框架日期控件使用方法详解
May 19 Javascript
基于Vue框架vux组件库实现上拉刷新功能
Nov 28 Javascript
vue 监听某个div垂直滚动条下拉到底部的方法
Sep 15 Javascript
微信小程序云开发之使用云函数
May 17 Javascript
2020京东618叠蛋糕js脚本(亲测好用)
Jun 02 Javascript
解决Element中el-date-picker组件不回填的情况
Nov 07 Javascript
对vue生命周期的深入理解
Dec 03 Vue.js
vue如何使用 Slot 分发内容实例详解
Sep 05 #Javascript
详解Vue2.0 事件派发与接收
Sep 05 #Javascript
JavaSctit 利用FileReader和滤镜上传图片预览功能
Sep 05 #Javascript
jQuery实现注册会员时密码强度提示信息功能示例
Sep 05 #jQuery
JSON在Javascript中的使用(eval和JSON.parse的区别)详细解析
Sep 05 #Javascript
详解vue-cli本地环境API代理设置和解决跨域
Sep 05 #Javascript
JavaScript正则表达式的贪婪匹配和非贪婪匹配
Sep 05 #Javascript
You might like
php实现用户在线时间统计详解
2011/10/08 PHP
PHP禁止个别IP访问网站
2013/10/30 PHP
php类的定义与继承用法实例
2015/07/07 PHP
js实现运行代码需要刷新的解决方法
2007/08/18 Javascript
jQuery Selector选择器小结
2010/05/06 Javascript
jquery使用ajax实现微信自动回复插件
2014/04/28 Javascript
如何正确使用Nodejs 的 c++ module 链接到 OpenSSL
2014/08/03 NodeJs
将JavaScript的jQuery库中表单转化为JSON对象的方法
2015/11/17 Javascript
Vue.2.0.5过渡效果使用技巧
2017/03/16 Javascript
使用nodejs爬取前程无忧前端技能排行
2017/05/06 NodeJs
angular实现spa单页面应用实例
2017/07/10 Javascript
VUE 配置vue-devtools调试工具及安装方法
2018/09/30 Javascript
Vue项目中使用better-scroll实现菜单映射功能方法
2019/09/11 Javascript
vue实现的封装全局filter并统一管理操作示例
2020/02/02 Javascript
js实现小球在页面规定的区域运动
2020/06/16 Javascript
vue3.0实现插件封装
2020/12/14 Vue.js
[01:05:32]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#1COL VS Alliance第一局
2016/03/04 DOTA
进一步了解Python中的XML 工具
2015/04/13 Python
Python递归函数定义与用法示例
2017/06/02 Python
python 调用c语言函数的方法
2017/09/29 Python
python 读取txt,json和hdf5文件的实例
2018/06/05 Python
python全栈知识点总结
2019/07/01 Python
Python二维码生成识别实例详解
2019/07/16 Python
Python使用微信itchat接口实现查看自己微信的信息功能详解
2019/08/22 Python
Django中提示消息messages的设置方式
2019/11/15 Python
解决keras模型保存h5文件提示无此目录问题
2020/07/01 Python
2014自荐信的写作技巧
2014/01/28 职场文书
优良学风班申请材料
2014/02/13 职场文书
体育课外活动总结
2014/07/08 职场文书
员工保密协议书
2014/09/27 职场文书
毕业生见习报告总结
2014/11/08 职场文书
2014年园林绿化工作总结
2014/12/11 职场文书
党员廉洁自律个人总结
2015/02/13 职场文书
城管个人总结
2015/02/28 职场文书
「SHOW BY ROCK!!」“雫シークレットマインド”组合单曲MV公开
2022/03/21 日漫
CSS使用Flex和Grid布局实现3D骰子
2022/08/05 HTML / CSS