浅谈JavaScript异步编程


Posted in Javascript onJanuary 20, 2017

在一年前初学js的时候,看过很多关于异步编程的讲解。但是由于实践经验少,没有办法理解的太多,太理论的东西也往往是看完就忘。

经过公司的三两个项目的锻炼,终于对js异步编程有了比较具体的理解。但始终入门较浅,在这里就当是给自己一个阶段性的总结。

在异步编程中,一条语句的执行不能依赖上一条语句执行完毕的结果,因为无法预测一条语句什么时候执行完毕,它与代码顺序无关,语句是并发执行的。

例如以下代码:

$.get($C.apiPath+'ucenter/padCharge/findMember',{id:memberId},function(data){
  if(data.error){
    layer.close(memberLayer);
    padInOut(padId,memberId);
    allPads();
  }
});

这三句在语境中的作用是,在完成某个ajax访问并成功获得数据之后,关闭某个弹层(1),执行padInOut函数(2),执行allPads函数(3);(1)的顺序无所谓,但是我希望(3)在(2)之后执行,然而这几句代码无法达到我希望的结果,因为三个函数是同时执行的,allPads无法等待padInOut执行完毕之后再执行,所以结果当然会出错。

我最后采取的解决方法是回调函数:在padInOut函数定义加入回调函数,如下:

function padInOut(padId,memberId,callback){
     $F.POSTLoading($C.apiPath + 'ucenter/padCharge/padInOut',{id:padId,memberId:memberId},function(data){
         if(callback)callback()
     });
 };

当方法执行完毕并且回调函数存在时,执行回调函数。此时函数执行时通过传参即可达到目的:

padInOut(padId,memberId,allPads)

回调函数是js异步编程经常会用到的方法。然而使用回调函数存在不好的地方,即会造成回调地狱。所以es新标准出来也不断寻求解决回调的方案。这是后话,本篇写到这里。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
使用jQuery中的when实现多个AJAX请求对应单个回调的例子分享
Apr 23 Javascript
javascript十六进制及二进制转化的方法
May 06 Javascript
jQuery代码实现发展历程时间轴特效
Jul 30 Javascript
javascript高级选择器querySelector和querySelectorAll全面解析
Apr 07 Javascript
JavaScript SHA-256加密算法详细代码
Oct 06 Javascript
Vue.js第三天学习笔记(计算属性computed)
Dec 01 Javascript
JavaScript自定义分页样式
Jan 17 Javascript
js实现百度搜索提示框
Feb 05 Javascript
AngularJS表单验证功能分析
May 26 Javascript
详解vue过滤器在v2.0版本用法
Jun 01 Javascript
swiper插件自定义切换箭头按钮
Dec 28 Javascript
使vue实现jQuery调用的两种方法
May 12 jQuery
JavaScript实现事件的中断传播和行为阻止方法示例
Jan 20 #Javascript
小程序开发实战:实现九宫格界面的导航的代码实现
Jan 19 #Javascript
BootStrap组件之进度条的基本用法
Jan 19 #Javascript
微信小程序 页面跳转和数据传递实例详解
Jan 19 #Javascript
js实现符合国情的日期插件详解
Jan 19 #Javascript
微信小程序 生命周期和页面的生命周期详细介绍
Jan 19 #Javascript
原生JS和jQuery操作DOM对比总结
Jan 19 #Javascript
You might like
一个阿拉伯数字转中文数字的函数
2006/10/09 PHP
php预定义常量
2006/12/25 PHP
php文件操作实例代码
2012/05/10 PHP
php变量作用域的深入解析
2013/06/03 PHP
Jquery 基础学习笔记之文档处理
2009/05/29 Javascript
javascript中setTimeout使用指南
2015/07/26 Javascript
用window.onerror捕获并上报Js错误的方法
2016/01/27 Javascript
ashx文件获取$.ajax()方法发送的数据
2016/05/26 Javascript
浅谈jQuery双事件多重加载的问题
2016/10/05 Javascript
js实现点击切换checkbox背景图片的简单实例
2017/05/08 Javascript
JavaScript实现二叉树的先序、中序及后序遍历方法详解
2017/10/26 Javascript
Vue 拦截器对token过期处理方法
2018/01/23 Javascript
JS面向对象的程序设计相关知识小结
2018/05/26 Javascript
vue-cli webpack 引入swiper的操作方法
2018/09/15 Javascript
vue中el-upload上传图片到七牛的示例代码
2018/10/19 Javascript
vue使用echarts图表的详细方法
2018/10/22 Javascript
JavaScript对象拷贝与赋值操作实例分析
2018/12/10 Javascript
微信小程序日历效果
2018/12/29 Javascript
使用typescript构建Vue应用的实现
2019/08/26 Javascript
vue下的@change事件的实现
2019/10/25 Javascript
vue更改数组中的值实例代码详解
2020/02/07 Javascript
python实现石头剪刀布小游戏
2021/01/20 Python
Python I/O与进程的详细讲解
2019/03/08 Python
Ubuntu18.04下python版本完美切换的解决方法
2019/06/14 Python
python turtle库画一个方格和圆实例
2019/06/27 Python
python写入文件自动换行问题的方法
2019/07/05 Python
简单了解python变量的作用域
2019/07/30 Python
Python Pickle 实现在同一个文件中序列化多个对象
2019/12/30 Python
最新Python idle下载、安装与使用教程图文详解
2020/11/28 Python
Right-on官方网站:日本知名的休闲服装品牌
2019/07/12 全球购物
安卓程序员求职信
2014/02/28 职场文书
数字化校园建设方案
2014/05/03 职场文书
物业公司的岗位任命书
2014/06/06 职场文书
2014全年工作总结
2014/11/27 职场文书
2016学习全国教书育人楷模先进事迹心得体会
2016/01/21 职场文书
JavaScript 中for/of,for/in 的详细介绍
2021/11/17 Javascript