详解jQuery中的deferred对象的使用(一)


Posted in Javascript onMay 27, 2016

 deferred对象是jQuery对Promises接口的实现。它是非同步操作的通用接口,可以被看作是一个等待完成的任务,开发者通过一些通过的接口对其进行设置。事实上,它扮演代理人(proxy)的角色,将那些非同步操作包装成具有某些统一特性的对象,典型例子就是Ajax操作、网页动画、web worker等等。

jQuery的所有Ajax操作函数,默认返回的就是一个deferred对象。

在jquery1.5之后的版本中,加入了一个deferred对象,也就是延迟对象,用来处理未来某一时间点发生的回调函数。同时,还改写了ajax方法,现在的ajax方法返回的是一个deferred对象。

那就来看看deferred对象的用法。

1.ajax的链式回调

// ajax方法返回的是一个deferred对象,可以直接使用链式写法
$.ajax('test.json').done(function(resp){
// done 相当于success回调,其中默认的参数为success回调的参数
alert('success');
}).fail(function(){
// fail 相当于error回调
alert('error');
});

还可以同时写多个回调,会按照顺序依次执行

$.ajax('test.json').done(function(resp){
// done 相当于success回调,其中默认的参数为success回调的参数
alert('success');
}).done(function(){
// do something...
}).done(function(){
// do something...
});

deferred对象还有一个then方法,其实它是一个整合done和fail的方法,它接受一到两个参数,如果有两个参数,那么第一个就是done方法的回调函数,第二个是fail方法的回调函数。如果只有一个参数,那就是done方法的回调函数。

var success = function(){
alert('success'); 
};
var error = function(){
alert('error');
};
// 两个参数
$.ajax('test.json').then(success, error);
// 一个参数
$.ajax('test.json').then(success);

jQuery还提供了一个$.when(deferreds)的方法来执行一个或多个延迟对象的回调函数,当它的参数是延迟对象时,它会在所有延迟对象代表的异步执行完后再执行相应的回调函数

$.when($.ajax('test.json'), $.ajax('demo.json')) .done(function(){
alert('success'); 
}).fail(function(){
alert('error');
});

很好理解,只有当所有异步都成功时,才会执行done方法中的回调,否则会执行fail方法中的回调,同样好理解的是的done方法中回调函数的默认参数数量则和when方法参数数量相同。

而如果when方法中传入的只是普通对象,不是deferred对象时,会立即执行done方法中的回调,回调函数的默认参数为传入when方法的对象本身。

// 当传入when方法的参数只是普通对象时
$.when({test: 'test'}).done(function(resp){
console.log(resp.test); // 'test' 
}).fail(function(){
// 由于传入的对象不是deferred对象,那么就不会调用fail中的回调了 
})

当你需要两个甚至更多的异步结束后才调用回调函数,同时这些异步ajax可能还需要修改传输方式type或者传数据data时,代码就显得很乱,可读性很差。

所以就可以对ajax进行再次封装,提高代码可读性

var ajax = function(url, type, param){
return $.ajax({
url: url,
type: type,
data: param || {} 
}); 
};
ajax('test.json').done(function(resp){
alert('success');
}).fail(function(){
alert('error');
});

以上所述是小编给大家介绍的jQuery中的deferred对象的使用(一)的相关知识,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript 点击整页变灰的效果(可做退出效果)。
Jan 09 Javascript
jQuery实现向下滑出的平滑下拉菜单效果
Aug 21 Javascript
javascript实现全角转半角的方法
Jan 23 Javascript
JavaScript实现九九乘法表的简单实例
Jun 07 Javascript
基于原生JS实现图片裁剪
Aug 01 Javascript
Vue filters过滤器的使用方法
Jul 14 Javascript
微信小程序实现折叠面板
Jan 31 Javascript
Vue中this.$router.push参数获取方法
Feb 27 Javascript
微信小程序实现倒计时调用相机自动拍照功能
Jun 10 Javascript
JavaScript实用代码小技巧
Aug 23 Javascript
javascript sort()对数组中的元素进行排序详解
Oct 13 Javascript
JS中队列和双端队列实现及应用详解
Sep 29 Javascript
基于JS实现密码框(password)中显示文字提示功能代码
May 27 #Javascript
使用jQuery制作Web页面遮罩层插件的实例教程
May 26 #Javascript
Node.js的npm包管理器基础使用教程
May 26 #Javascript
JavaScript中的各种操作符使用总结
May 26 #Javascript
浅析JavaScript中的对象类型Object
May 26 #Javascript
简单总结JavaScript中的String字符串类型
May 26 #Javascript
BootStrap中Datetimepicker和uploadify插件应用实例小结
May 26 #Javascript
You might like
phpmyadmin出现Cannot start session without errors问题解决方法
2014/08/14 PHP
从零开始学YII2框架(一)通过Composer安装Yii2框架
2014/08/20 PHP
PHP编程计算日期间隔天数的方法
2017/04/26 PHP
老生常谈PHP面向对象之解释器模式
2017/05/17 PHP
PHP使用POP3读取邮箱接收邮件的示例代码
2020/07/08 PHP
JAVASCRIPT HashTable
2007/01/22 Javascript
用JavaScript实现类似于ListBox功能示例代码
2014/03/09 Javascript
JQuery中$(document)是什么意思有什么作用
2014/07/21 Javascript
js实现多选项切换导航菜单的方法
2015/02/06 Javascript
JS中Location使用详解
2015/05/12 Javascript
浅谈jQuery 中的事件冒泡和阻止默认行为
2016/05/28 Javascript
基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)
2016/06/22 Javascript
轻松理解Javascript变量的相关问题
2017/01/20 Javascript
mui 打开新窗口的方式总结及注意事项
2017/08/20 Javascript
js封装成插件的步骤方法
2017/09/11 Javascript
node中的session的具体使用
2018/09/14 Javascript
AngularJs返回前一页面时刷新一次前面页面的方法
2018/10/09 Javascript
vue 双向数据绑定的实现学习之监听器的实现方法
2018/11/30 Javascript
详解vue中axios的使用与封装
2019/03/20 Javascript
[55:25]2018DOTA2亚洲邀请赛3月29日 小组赛A组 VG VS OG
2018/03/30 DOTA
使用Python压缩和解压缩zip文件的教程
2015/05/06 Python
python 获取文件下所有文件或目录os.walk()的实例
2018/04/23 Python
Python实现正整数分解质因数操作示例
2018/08/01 Python
Python 经典面试题 21 道【不可错过】
2018/09/21 Python
Python获取Redis所有Key以及内容的方法
2019/02/19 Python
Python3.5 Pandas模块之Series用法实例分析
2019/04/23 Python
详解Tensorflow不同版本要求与CUDA及CUDNN版本对应关系
2020/08/04 Python
HTML5页面音视频在微信和app下自动播放的实现方法
2016/10/20 HTML / CSS
全球速卖通:AliExpress(国际版淘宝)
2017/09/20 全球购物
个人自我评价和职业目标
2014/01/24 职场文书
《童趣》教学反思
2014/02/19 职场文书
班主任寄语大全
2014/04/04 职场文书
学习型班组申报材料
2014/05/31 职场文书
党的群众路线教育实践活动方案
2014/10/31 职场文书
党校个人总结
2015/03/04 职场文书
解决mysql问题:由于找不到MSVCR120.dll,无法继续执行代码
2021/06/26 MySQL