ajax 同步请求和异步请求的差异分析


Posted in Javascript onJuly 04, 2011

ajax同步和异步的差异, 先看2段代码:
代码一:

Synchronize = function(url,param) { 
function createXhrObject() { 
var http; 
var activeX = [ "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ]; 
try { 
http = new XMLHttpRequest; 
} catch (e) { 
for (var i = 0; i < activeX.length; ++i) { 
try { 
http = new ActiveXObject(activeX[i]); 
break; 
} catch (e) {} 
} 
} finally { 
return http; 
} 
} 
var conn = createXhrObject(); 
conn.open("POST", url, false);//ajax同步 
conn.send(param); 
var strReturn = conn.responseText; 
alert("1"); 
if (strReturn != "") { 
return Ext.decode(conn.responseText); 
} else { 
return null; 
} 
alert("2"); 
};

代码二:
Ajax 同步请求方式:
Synchronize = function(url,param) { 
function createXhrObject() { 
var http; 
var activeX = [ "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ]; 
try { 
http = new XMLHttpRequest; 
} catch (e) { 
for (var i = 0; i < activeX.length; ++i) { 
try { 
http = new ActiveXObject(activeX[i]); 
break; 
} catch (e) {} 
} 
} finally { 
return http; 
} 
} 
var conn = createXhrObject(); 
conn.open("POST", url, true);//ajax异步 
conn.send(param); 
var strReturn = conn.responseText; 
alert("1"); 
if (strReturn != "") { 
return Ext.decode(conn.responseText); 
} else { 
return null; 
} 
alert("2"); 
};

同步和异步的差异如下:

conn.open('POST',Url,true); // ajax异步
conn.open('POST',Url,false); // ajax同步

对于代码二,为异步的ajax请求,执行结果为:先执行alert(2)再执行alert(1), 异步的意思就是说一旦conn.open请求一发出,前端不去等待它的响应便执行后面的代码,所以alert(2)先执行了,然后当响应response到达以后才执行alert(1);

对于代码一,为同步的ajax请求,执行结果为:先执行alert(1)再执行alert(2), 同步的意思就是说一旦conn.open请求一发出,前端就去等待它的响应,响应完成以后,alert(1)先执行了,然后alert(2);

Javascript 相关文章推荐
JavaScript Event学习第三章 早期的事件处理程序
Feb 07 Javascript
JQuery循环滚动图片代码
Dec 08 Javascript
自动刷新网页,自动刷新当前页面,JS调用
Jun 24 Javascript
jQuery animate和CSS3相结合实现缓动追逐效果附源码下载
Apr 18 Javascript
原生JS实现网络彩票投注效果
Sep 25 Javascript
JavaScript变量作用域_动力节点Java学院整理
Jun 27 Javascript
Vue2.0 vue-source jsonp 跨域请求
Aug 04 Javascript
seajs实现强制刷新本地缓存的方法分析
Oct 16 Javascript
vue2.0父子组件间传递数据的方法
Aug 16 Javascript
前端防止用户重复提交js实现代码示例
Sep 07 Javascript
js实现适配移动端的拖动效果
Jan 13 Javascript
解决Nuxt使用axios跨域问题
Jul 06 Javascript
Extjs EditorGridPanel中ComboBox列的显示问题
Jul 04 #Javascript
Extjs gridpanel 出现横向滚动条问题的解决方法
Jul 04 #Javascript
JS分割字符串并放入数组的函数
Jul 04 #Javascript
js列举css中所有图标的实现代码
Jul 04 #Javascript
初学js 新节点的创建 删除 的步骤
Jul 04 #Javascript
初学js插入节点appendChild insertBefore使用方法
Jul 04 #Javascript
javascript中类的定义及其方式(《javascript高级程序设计》学习笔记)
Jul 04 #Javascript
You might like
解析PHP中empty is_null和isset的测试
2013/06/29 PHP
PHP实现将科学计数法转换为原始数字字符串的方法
2014/12/16 PHP
不错的新闻标题颜色效果
2006/12/10 Javascript
jQuery基础框架浅入剖析
2012/12/27 Javascript
javascript实现数字验证码的简单实例
2014/02/10 Javascript
javascript window.open打开新窗口后无法再次打开该窗口问题的解决方法
2014/04/12 Javascript
Javascript实现的常用算法(如冒泡、快速、鸽巢、奇偶等)
2014/04/29 Javascript
采用自执行的匿名函数解决for循环使用闭包的问题
2014/09/11 Javascript
jQuery 弹出层插件(推荐)
2016/05/24 Javascript
javascript 解决浏览器不支持的问题
2016/09/24 Javascript
微信小程序 devtool隐藏的秘密
2017/01/21 Javascript
jquery实现刷新随机变化样式特效(tag标签样式)
2017/02/03 Javascript
Node.js中使用mongoose操作mongodb数据库的方法
2017/09/12 Javascript
axios post提交formdata的实例
2018/03/16 Javascript
用图片替换checkbox原始样式并实现同样的功能
2018/11/15 Javascript
vuex 中插件的编写案例解析
2019/06/10 Javascript
精读《Vue3.0 Function API》
2020/05/20 Javascript
解决vue-cli输入命令vue ui没效果的问题
2020/11/17 Javascript
[02:43]2014DOTA2国际邀请赛 官方Alliance战队纪录片
2014/07/14 DOTA
关于你不想知道的所有Python3 unicode特性
2014/11/28 Python
使用Python抓取模板之家的CSS模板
2015/03/16 Python
Python while 循环使用的简单实例
2016/06/08 Python
Python中数组,列表:冒号的灵活用法介绍(np数组,列表倒序)
2018/04/18 Python
python tornado微信开发入门代码
2018/08/24 Python
Django中自定义模型管理器(Manager)及方法
2019/09/23 Python
python找出列表中大于某个阈值的数据段示例
2019/11/24 Python
python 实现有道翻译功能
2021/02/26 Python
BISSELL官网:北美吸尘器第一品牌
2019/03/14 全球购物
关于幼儿的自我评价
2013/12/18 职场文书
工程开工庆典邀请函
2014/02/01 职场文书
2014年办公室个人工作总结
2014/11/12 职场文书
求职信范文怎么写
2015/03/19 职场文书
学校推普周活动总结
2015/05/07 职场文书
教师读书笔记
2015/06/29 职场文书
体育教师研修感悟
2015/11/18 职场文书
2016年小学“我们的节日·中秋节”活动总结
2016/04/05 职场文书