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 相关文章推荐
jQuery1.6 使用方法一
Nov 23 Javascript
javascript表单验证 - Parsley.js使用和配置
Jan 25 Javascript
JQuery中Bind()事件用法分析
May 05 Javascript
使用递归遍历对象获得value值的实现方法
Jun 14 Javascript
聊一聊JS中的prototype
Sep 29 Javascript
jquery+ajax实现省市区三级联动 (封装和不封装两种方式)
May 15 jQuery
JS获取数组中出现次数最多及第二多元素的方法
Oct 27 Javascript
详细分析单线程JS执行问题
Nov 22 Javascript
详解如何实现一个简单的 vuex
Feb 10 Javascript
JavaScript模板引擎原理与用法详解
Dec 24 Javascript
bootstrap Table实现合并相同行
Jul 19 Javascript
Vue数字输入框组件的使用方法
Oct 19 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源代码加密?PHP二进制加密与解密的解决办法
2013/04/22 PHP
PHP中的函数-- foreach()的用法详解
2013/06/24 PHP
jQuery获取css z-index在各种浏览器中的返回值
2010/09/15 Javascript
dojo学习第二天 ajax异步请求之绑定列表
2011/08/29 Javascript
js跨浏览器实现将字符串转化为xml对象的方法
2013/09/25 Javascript
JQuery插入DOM节点的方法
2015/06/11 Javascript
jquery移动点击的项目到列表最顶端的方法
2015/06/24 Javascript
详解AngularJS中$http缓存以及处理多个$http请求的方法
2016/02/06 Javascript
jQuery实现点击某个div打开层,点击其他div关闭层实例分析(阻止冒泡)
2016/11/18 Javascript
javascript基本数据类型和转换
2017/03/17 Javascript
用jQuery实现圆点图片轮播效果
2017/03/19 Javascript
vuejs中监听窗口关闭和窗口刷新事件的方法
2018/09/21 Javascript
JavaScript实现省份城市的三级联动
2020/02/11 Javascript
Vue+elementUI实现多图片上传与回显功能(含回显后继续上传或删除)
2020/03/23 Javascript
Python中的ctime()方法使用教程
2015/05/22 Python
python实现可以断点续传和并发的ftp程序
2016/09/13 Python
Mac下Anaconda的安装和使用教程
2018/11/29 Python
python图形工具turtle绘制国际象棋棋盘
2019/05/23 Python
详解python实现数据归一化处理的方式:(0,1)标准化
2019/07/17 Python
python3中的logging记录日志实现过程及封装成类的操作
2020/05/12 Python
Python基于httpx模块实现发送请求
2020/07/07 Python
Python tempfile模块生成临时文件和临时目录
2020/09/30 Python
Python Selenium库的基本使用教程
2021/01/04 Python
html5 canvas移动浏览器上实现图片压缩上传
2016/03/11 HTML / CSS
Hush Puppies澳大利亚官网:舒适的男女休闲和正装鞋
2019/08/24 全球购物
CLR与IL分别是什么含义
2016/08/23 面试题
企业晚会策划方案
2014/05/29 职场文书
学校纪律作风整改措施思想汇报
2014/10/11 职场文书
党的群众路线教育实践活动个人批评与自我批评
2014/10/16 职场文书
2014年社区综治工作总结
2014/11/17 职场文书
道德模范事迹材料
2014/12/20 职场文书
给老婆的检讨书
2015/01/27 职场文书
2016年“12.3”国际残疾人日活动总结
2016/04/01 职场文书
pytorch常用数据类型所占字节数对照表一览
2021/05/17 Python
php实现自动生成验证码的实例讲解
2021/11/17 PHP
CSS实现五种常用的2D转换
2021/12/06 HTML / CSS