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 相关文章推荐
模拟用户操作Input元素,不会触发相应事件
May 11 Javascript
一个js拖拽的效果类和dom-drag.js浅析
Jul 17 Javascript
JavaScript 反科里化 this [译]
Sep 20 Javascript
Jquery倒数计时按钮setTimeout的实例代码
Jul 04 Javascript
浅谈JavaScript超时调用和间歇调用
Aug 30 Javascript
javascript仿百度输入框提示自动下拉补全
Jan 07 Javascript
瀑布流的实现方式(原生js+jquery+css3)
Jun 28 Javascript
js实现数组去重方法及效率?Ρ? target=
Feb 14 Javascript
js实现文件上传功能 后台使用MultipartFile
Sep 08 Javascript
vue发送websocket请求和http post请求的实例代码
Jul 11 Javascript
使用element-ui的el-menu导航选中后刷新页面保持当前选中状态
Jul 19 Javascript
微信小程序通过js实现瀑布流布局详解
Aug 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
短波问题解答
2021/02/28 无线电
php mssql 分页SQL语句优化 持续影响
2009/04/26 PHP
php下拉选项的批量操作的实现代码
2013/10/14 PHP
php使用curl获取https请求的方法
2015/02/11 PHP
zen_cart实现支付前生成订单的方法
2016/05/06 PHP
项目中应用Redis+Php的场景
2016/05/22 PHP
PHP flush 函数使用注意事项
2016/08/26 PHP
PHP基于session.upload_progress 实现文件上传进度显示功能详解
2019/08/09 PHP
Javascript常用运算符(Operators)-javascript基础教程
2007/12/14 Javascript
jquery上传插件fineuploader上传文件使用方法(jquery图片上传插件)
2013/12/05 Javascript
三种方式获取XMLHttpRequest对象
2014/04/21 Javascript
Javascript中call和apply函数的比较和使用实例
2015/02/03 Javascript
jquery输入数字随机抽奖特效的简单实现代码
2016/06/10 Javascript
JS 日期与时间戮相互转化的简单实例
2016/06/22 Javascript
jQuery基本过滤选择器用法示例
2016/09/09 Javascript
JS正则表达式之非捕获分组用法实例分析
2016/12/28 Javascript
微信小程序 实战程序简易新闻的制作
2017/01/09 Javascript
微信小程序 摇一摇抽奖简单实例实现代码
2017/01/09 Javascript
Vue.js在使用中的一些注意知识点
2017/04/29 Javascript
Vue2.0表单校验组件vee-validate的使用详解
2017/05/02 Javascript
JavaScript仿微信打飞机游戏
2020/07/05 Javascript
vue项目常用组件和框架结构介绍
2017/12/24 Javascript
微信小程序实现倒计时补零功能
2018/07/09 Javascript
学习python之编写简单简单连接数据库并执行查询操作
2016/02/27 Python
python thrift搭建服务端和客户端测试程序
2018/01/17 Python
Python读取指定日期邮件的实例
2019/02/01 Python
Keras 使用 Lambda层详解
2020/06/10 Python
Python 读取位于包中的数据文件
2020/08/07 Python
CSS3中的常用选择器使用示例整理
2016/06/13 HTML / CSS
银行优秀员工推荐信
2015/03/24 职场文书
个人廉政承诺书
2015/04/28 职场文书
Python数据分析入门之教你怎么搭建环境
2021/05/13 Python
Python破解极验滑动验证码详细步骤
2021/05/21 Python
python自动化操作之动态验证码、滑动验证码的降噪和识别
2021/08/30 Python
Golang 入门 之url 包
2022/05/04 Golang
Python+Pillow+Pytesseract实现验证码识别
2022/05/11 Python