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 相关文章推荐
js实现顶部可折叠的菜单工具栏效果实例
May 09 Javascript
通用javascript代码判断版本号是否在版本范围之间
Nov 29 Javascript
JavaScript:Array类型全面解析
May 19 Javascript
JavaScript实现无穷滚动加载数据
May 06 Javascript
原生JS发送异步数据请求
Jun 08 Javascript
vue项目常用组件和框架结构介绍
Dec 24 Javascript
微信小程序录音与播放录音功能
Dec 25 Javascript
JS关于刷新页面的相关总结
May 09 Javascript
Node.js 进程平滑离场剖析小结
Jan 24 Javascript
详解Vue项目中实现锚点定位
Apr 24 Javascript
Vuex modules模式下mapState/mapMutations的操作实例
Oct 17 Javascript
vue结合el-upload实现腾讯云视频上传功能
Jul 01 Javascript
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安装xdebug/php安装pear/phpunit详解步骤(图)
2013/12/22 PHP
PHP读取CURL模拟登录时生成Cookie文件的方法
2014/11/04 PHP
再Docker中架设完整的WordPress站点全攻略
2015/07/29 PHP
PHP通过curl获取接口URL的数据方法
2018/05/31 PHP
Jquery上传插件 uploadify v3.1使用说明
2012/06/18 Javascript
JavaScript高级程序设计(第3版)学习笔记 概述
2012/10/11 Javascript
深入探讨javascript函数式编程
2015/10/11 Javascript
实现非常简单的js双向数据绑定
2015/11/06 Javascript
理解javascript模块化
2016/03/28 Javascript
基于JQuery实现的跑马灯效果(文字无缝向上翻动)
2016/12/02 Javascript
jQuery实现6位数字密码输入框
2016/12/29 Javascript
jQuery插件echarts实现的多柱子柱状图效果示例【附demo源码下载】
2017/03/04 Javascript
vue项目打包之后背景样式丢失的解决方案
2019/01/17 Javascript
详解项目升级到vue-cli3的正确姿势
2019/01/28 Javascript
原生JS使用Canvas实现拖拽式绘图功能
2019/06/05 Javascript
微信小程序实现页面分享onShareAppMessage
2019/08/12 Javascript
Vue组件化开发之通用型弹出框的实现
2020/02/28 Javascript
js实现简单点赞操作
2020/03/17 Javascript
Python使用Flask-SQLAlchemy连接数据库操作示例
2018/08/31 Python
详解python--模拟轮盘抽奖游戏
2019/04/12 Python
python使用tomorrow实现多线程的例子
2019/07/20 Python
简单了解django文件下载方式
2020/02/10 Python
最新2019Pycharm安装教程 亲测
2020/02/28 Python
scrapy-splash简单使用详解
2021/02/21 Python
法国大使拉杆箱官网:DELSEY Paris
2018/03/20 全球购物
如何获得EntityManager
2014/02/09 面试题
个人作风剖析材料
2014/02/02 职场文书
应届毕业生求职信范文
2014/05/08 职场文书
小学关爱留守儿童活动方案
2014/08/25 职场文书
人身损害赔偿协议书范本
2014/09/27 职场文书
营销计划书
2015/01/17 职场文书
工程部经理岗位职责
2015/02/02 职场文书
员工家属慰问信
2015/03/24 职场文书
班主任工作经验交流会总结
2015/11/02 职场文书
慰问信(范文3篇)
2019/10/23 职场文书
SQL Server作业失败:无法确定所有者是否有服务器访问权限的解决方法
2021/06/30 SQL Server