js异步编程小技巧详解


Posted in Javascript onAugust 14, 2017

异步回调是js的一大特性,理解好用好这个特性可以写出很高质量的代码。分享一些实际用的一些异步编程技巧。

1.我们有些应用环境是需要等待两个http请求或IO操作返回后进行后续逻辑的处理。而这种情况使用回调嵌套代码会显得很难维护,而且也没有充分使用js的异步优势。

看下实例(为了大家容易理解使用了jq作为示例)

$.get("获取数据1.html",function(data,status){
   $.get("获取数据2.html",function(data1,status1){
    //使用 data 和data1逻辑
  });
 });

这种代码明显需要等待上个ajax请求返回后才会进行第二个请求,效率很低,而且回调嵌很不利于逻辑。我们可以使用计数器的方式,每完成一个请求计数器加1 当计数器等于2时执行回调逻辑

var get_data
var get-data1
function next(){
  //使用 data 和data1逻辑
}
$.get("获取数据1.html",function(data,status){
  get_data=data
  (++over === all) && (next());
 });
$.get("获取数据2.html",function(data1,status1){
  get_data1=data1
  (++over === all) && (next());
   
});

这种方式两个http并行发送,极大的提高了效率

Javascript 相关文章推荐
给网站上的广告“加速”显示的方法
Apr 08 Javascript
javascript阻止浏览器后退事件防止误操作清空表单
Nov 22 Javascript
jquery默认校验规则整理
Mar 24 Javascript
JavaScript动态添加事件之事件委托
Jul 12 Javascript
JavaScript使用forEach()与jQuery使用each遍历数组时return false 的区别
Aug 26 Javascript
Angular17之Angular自定义指令详解
Jan 21 Javascript
微信小程序实现漂亮的弹窗效果
May 26 Javascript
vue路由前进后退动画效果的实现代码
Dec 10 Javascript
发布一款npm包帮助理解npm的使用
Jan 03 Javascript
Vue实现类似Spring官网图片滑动效果方法
Mar 01 Javascript
D3.js的基础部分之数组的处理数组的排序和求值(v3版本)
May 09 Javascript
JavaScript构造函数原理及实现流程解析
Nov 19 Javascript
js数字滑动时钟的简单实现(示例讲解)
Aug 14 #Javascript
使用yeoman构建angular应用的方法
Aug 14 #Javascript
AngularJS 购物车全选/取消全选功能的实现方法
Aug 14 #Javascript
使用D3.js制作图表详解
Aug 13 #Javascript
Vue-Cli中自定义过滤器的实现代码
Aug 12 #Javascript
react开发教程之React 组件之间的通信方式
Aug 12 #Javascript
vuejs+element-ui+laravel5.4上传文件的示例代码
Aug 12 #Javascript
You might like
简单的php缓存类分享     php缓存机制
2014/01/22 PHP
destoon之一键登录设置
2014/06/21 PHP
PHP中数据库单例模式的实现代码分享
2014/08/21 PHP
PHP入门教程之会话控制技巧(cookie与session)
2016/09/11 PHP
PHP通过bypass disable functions执行系统命令的方法汇总
2018/05/02 PHP
js 日期转换成中文格式的函数
2009/07/07 Javascript
JQuery扩展插件Validate 3通过参数设置错误信息
2011/09/05 Javascript
Js操作Select大全(取值、设置选中等等)
2013/10/29 Javascript
JavaScript引用类型和基本类型详解
2016/01/06 Javascript
location.hash保存页面状态的技巧
2016/04/28 Javascript
深入理解jQuery事件绑定
2016/06/02 Javascript
全面解析标签页的切换方式
2016/08/21 Javascript
Node.js 实现简单小说爬虫实例
2016/11/18 Javascript
js利用for in循环获取 一个对象的所有属性以及值的实例
2017/03/30 Javascript
JS 实现banner图片轮播效果(鼠标事件)
2017/08/04 Javascript
JavaScript实现写入文件到本地的方法【基于FileSaver.js插件】
2018/03/15 Javascript
解决vue中虚拟dom,无法实时更新的问题
2018/09/15 Javascript
vue自定义js图片碎片轮播图切换效果的实现代码
2019/04/28 Javascript
Node.js实现一个HTTP服务器的方法示例
2019/05/13 Javascript
详解JavaScript 异步编程
2020/07/13 Javascript
简单的python后台管理程序
2017/04/13 Python
python3使用QQ邮箱发送邮件
2020/05/20 Python
Python数据类型之列表和元组的方法实例详解
2019/07/08 Python
Python 批量刷博客园访问量脚本过程解析
2019/08/30 Python
Python关于__name__属性的含义和作用详解
2020/02/19 Python
用Python 爬取猫眼电影数据分析《无名之辈》
2020/07/24 Python
python爬虫 requests-html的使用
2020/11/30 Python
利用Python实现自动扫雷小脚本
2020/12/17 Python
html2canvas生成清晰的图片实现打印的示例代码
2019/09/30 HTML / CSS
Lookfantastic德国官网:英国知名美妆购物网站
2017/06/11 全球购物
Dr. Martens马汀博士澳大利亚官网:马丁靴鼻祖
2019/07/02 全球购物
《维生素c的故事》教学反思
2014/02/18 职场文书
华清池导游词
2015/02/02 职场文书
《画家和牧童》教学反思
2016/02/17 职场文书
《女娲补天》读后感5篇
2019/12/31 职场文书
golang语言指针操作
2022/04/14 Golang