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 相关文章推荐
JS 遮照层实现代码
Mar 31 Javascript
js控制的遮罩层实例介绍
May 29 Javascript
angularJS 中$scope方法使用指南
Feb 09 Javascript
JavaScript 实现完美兼容多浏览器的复制功能代码
Apr 28 Javascript
AngularJS中实现用户访问的身份认证和表单验证功能
Apr 21 Javascript
Javascript小技能总结(推荐)
Jun 02 Javascript
Node.js环境下编写爬虫爬取维基百科内容的实例分享
Jun 12 Javascript
使用async-validator编写Form组件的方法
Jan 10 Javascript
用原生 JS 实现 innerHTML 功能实例详解
Apr 03 Javascript
Vue源码分析之Vue实例初始化详解
Aug 25 Javascript
0基础学习前端开发的一些建议
Jul 14 Javascript
JavaScript canvas实现跟随鼠标移动小球
Feb 09 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
收音机怀古---春雷3P7图片欣赏
2021/03/02 无线电
PHP获取当前日期所在星期(月份)的开始日期与结束日期(实现代码)
2013/06/18 PHP
PHP读取RSS(Feed)简单实例
2014/06/12 PHP
yii实现使用CUploadedFile上传文件的方法
2015/12/28 PHP
php实现的二分查找算法示例
2017/06/20 PHP
模拟用户操作Input元素,不会触发相应事件
2007/05/11 Javascript
JavaScript 学习笔记(十一)
2010/01/19 Javascript
JS打开图片另存为对话框实现代码
2012/12/26 Javascript
通过Javascript读取本地Excel文件内容的代码示例
2014/04/08 Javascript
基于jQuery和CSS3制作数字时钟附源码下载(jquery篇)
2015/11/24 Javascript
省市二级联动小案例讲解
2016/07/24 Javascript
js控制div层的叠加简单方法
2016/10/15 Javascript
html、css和jquery相结合实现简单的进度条效果实例代码
2016/10/24 Javascript
AngularJS的依赖注入实例分析(使用module和injector)
2017/01/19 Javascript
jQuery中animate()的使用方法及解决$(”body“).animate({“scrollTop”:top})不被Firefox支持的问题
2017/04/04 jQuery
在Debian(Raspberry Pi)树莓派上安装NodeJS的教程详解
2017/09/19 NodeJs
利用JS判断客户端类型你应该知道的四种方法
2017/12/22 Javascript
JS实现带导航城市列表以及输入搜索功能
2018/01/04 Javascript
echarts设置图例颜色和地图底色的方法实例
2018/08/01 Javascript
viewer.js一个强大的基于jQuery的图像查看插件(支持旋转、缩放)
2020/04/01 jQuery
[06:40]2014DOTA2西雅图国际邀请赛 DK战队巡礼
2014/07/07 DOTA
[05:06]2017亚洲邀请赛DAC回顾片
2017/04/19 DOTA
动态创建类实例代码
2009/10/07 Python
Python中使用不同编码读写txt文件详解
2015/05/28 Python
Python selenium文件上传方法汇总
2020/11/19 Python
在python中利用opencv简单做图片比对的方法
2019/01/24 Python
梅尔倒谱系数(MFCC)实现
2019/06/19 Python
Python中Selenium库使用教程详解
2020/07/23 Python
CSS3实现全景图特效示例代码
2018/03/26 HTML / CSS
HTML5 video播放器全屏(fullScreen)方法实例
2015/04/24 HTML / CSS
javascript实现用户必须勾选协议实例讲解
2021/03/24 Javascript
上课迟到检讨书100字
2014/01/11 职场文书
最新创业融资计划书
2014/01/19 职场文书
《金钱的魔力》教学反思
2014/02/24 职场文书
毕业证委托书范文
2014/09/26 职场文书
关于windows server 2012 DC 环境 重启后蓝屏代码:0xc00002e2的问题
2022/05/25 Servers