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实现跨域访问的三种方法
Dec 09 Javascript
jQuery实现手机版页面翻页效果的简单实例
Oct 05 Javascript
浅谈jQuery中的eq()与DOM中element.[]的区别
Oct 28 Javascript
JS实现拖拽的方法分析
Dec 20 Javascript
Canvas实现放射线动画效果
Feb 15 Javascript
提高Web性能的前端优化技巧总结
Feb 27 Javascript
详解Angular2 关于*ngFor 嵌套循环
May 22 Javascript
AngularJS中使用three.js的实例详解
Jul 21 Javascript
web前端页面生成exe可执行文件的方法
Feb 08 Javascript
vue实现同一个页面可以有多个router-view的方法
Sep 20 Javascript
原生JavaScript实现日历功能代码实例(无引用Jq)
Sep 23 Javascript
electron-vue开发环境内存泄漏问题汇总
Oct 10 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
动漫女神老婆无限好,但日本女生可能就不是这么一回事了!
2020/03/04 日漫
php给一组指定关键词添加span标签的方法
2015/03/31 PHP
YII动态模型(动态表名)支持分析
2016/03/29 PHP
Kindeditor编辑器添加图片上传水印功能(php代码)
2017/08/03 PHP
JavaScript 格式字符串的应用
2010/03/29 Javascript
简介JavaScript中toTimeString()方法的使用
2015/06/12 Javascript
举例讲解AngularJS中的模块
2015/06/17 Javascript
js实现不提交表单获取单选按钮值的方法
2015/08/21 Javascript
基于html5和nodejs相结合实现websocket即使通讯
2015/11/19 NodeJs
阿里巴巴技术文章分享 Javascript继承机制的实现
2016/01/14 Javascript
Bootstrap每天必学之滚动监听
2016/03/16 Javascript
基于javascript实现简单的抽奖系统
2020/04/15 Javascript
jQuery Tags Input Plugin(添加/删除标签插件)详解
2016/06/20 Javascript
JavaScript严格模式详解
2017/01/16 Javascript
Vue实现内部组件轮播切换效果的示例代码
2018/04/07 Javascript
Vue中使用vue-i18插件实现多语言切换功能
2018/04/25 Javascript
vue 解决form表单提交但不跳转页面的问题
2019/10/30 Javascript
vue打包npm run build时候界面报错的解决
2020/08/13 Javascript
js实现Element中input组件的部分功能并封装成组件(实例代码)
2021/03/02 Javascript
[02:43]DOTA2英雄基础教程 圣堂刺客
2013/12/09 DOTA
Python实现的生成自我描述脚本分享(很有意思的程序)
2014/07/18 Python
python实现简单socket通信的方法
2016/04/19 Python
Python3.5 创建文件的简单实例
2018/04/26 Python
Centos下实现安装Python3.6和Python2共存
2018/08/15 Python
安装docker-compose的两种最简方法
2019/07/30 Python
python中的线程threading.Thread()使用详解
2019/12/17 Python
解决keras,val_categorical_accuracy:,0.0000e+00问题
2020/07/02 Python
css3 pointer-events 介绍详解
2017/09/18 HTML / CSS
MADE荷兰:提供原创设计师家具
2018/04/03 全球购物
复核员上岗演讲稿
2014/01/05 职场文书
《千年梦圆在今朝》教学反思
2014/02/24 职场文书
家长建议怎么写
2014/05/15 职场文书
2014年优质护理服务工作总结
2014/11/14 职场文书
一文弄懂MySQL索引创建原则
2022/02/28 MySQL
SpringBoot2零基础到精通之异常处理与web原生组件注入
2022/03/22 Java/Android
Python数组变形的几种实现方法
2022/05/30 Python