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 相关文章推荐
jquery表格内容筛选实现思路及代码
Apr 16 Javascript
javascript字母大小写转换的4个函数详解
May 09 Javascript
Bootstrap的图片轮播示例代码
Aug 31 Javascript
JS实现的表格操作类详解(添加,删除,排序,上移,下移)
Dec 22 Javascript
jQuery选择器总结之常用元素查找方法
Aug 04 Javascript
js的OOP继承实现(必看篇)
Feb 18 Javascript
前端把html表格生成为excel表格的实例
Sep 19 Javascript
js 索引下标之li集合绑定点击事件
Jan 12 Javascript
JS设计模式之访问者模式定义与用法分析
Feb 05 Javascript
Vue实现左右菜单联动实现代码
Aug 12 Javascript
vue 弹出遮罩层样式实例
Jul 22 Javascript
React + Threejs + Swiper 实现全景图效果的完整代码
Jun 28 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
浅谈apache和nginx的rewrite的区别
2013/02/22 PHP
PHP字符串的编码问题的详细介绍
2013/04/27 PHP
php+mysqli批量查询多张表数据的方法
2015/01/29 PHP
PHP批量查询WordPress留言者E-mail地址实现方法
2015/02/15 PHP
PHP数组式访问接口ArrayAccess用法分析
2017/12/28 PHP
根据出生日期自动取得星座的js代码
2010/07/20 Javascript
原生js拖拽(第一课 未兼容)拖拽思路
2013/03/29 Javascript
利用jquery操作Radio方法小结
2014/10/20 Javascript
JS实现的表格操作类详解(添加,删除,排序,上移,下移)
2015/12/22 Javascript
js与jQuery实现checkbox复选框全选/全不选的方法
2016/01/05 Javascript
js实现div在页面拖动效果
2016/05/04 Javascript
jQuery子元素过滤选择器用法示例
2016/09/09 Javascript
jQuey将序列化对象在前台显示地实现代码(方法总结)
2016/12/13 Javascript
微信小程序 PHP生成带参数二维码
2017/02/21 Javascript
Thinkphp5微信小程序获取用户信息接口的实例详解
2017/09/26 Javascript
javascript 缓冲运动框架的实现
2017/09/29 Javascript
手动用webpack搭建第一个ReactApp的示例
2018/04/11 Javascript
原生JS与JQ获取元素的区别详解
2020/02/13 Javascript
微信小程序开发之获取用户手机号码(php接口解密)
2020/05/17 Javascript
八种Vue组件间通讯方式合集(推荐)
2020/08/18 Javascript
[06:40]2014DOTA2西雅图国际邀请赛 DK战队巡礼
2014/07/07 DOTA
python表格存取的方法
2018/03/07 Python
Django项目实战之用户头像上传与访问的示例
2018/04/21 Python
Selenium chrome配置代理Python版的方法
2018/11/29 Python
使用python3实现操作串口详解
2019/01/01 Python
python gdal安装与简单使用
2019/08/01 Python
Python logging模块进行封装实现原理解析
2020/08/07 Python
使用CSS3制作一个简单的Chrome模拟器
2015/07/15 HTML / CSS
仿CSDN Blog返回页面顶部功能实现原理及代码
2013/06/30 HTML / CSS
Theo + George官方网站:都柏林时尚品牌
2019/04/08 全球购物
学校司机岗位职责
2013/11/14 职场文书
二年级学生评语大全
2014/04/23 职场文书
2014年十八届四中全会思想汇报范文
2014/10/17 职场文书
工作态度怎么写
2015/06/25 职场文书
职工的安全责任书范文!
2019/07/02 职场文书
超级详细实用的pycharm常用快捷键
2021/05/12 Python