jQuery --deferred 延迟对象
来源:互联网 发布:互力微信淘客软件 编辑:程序博客网 时间:2024/03/29 15:38
在实际的开发过程中我们常碰见一些异步操作,比如ajax和遍历一个很大的数组,不是一时半会就能得到结果,因此就需要回调函数,但是jquery在回调函数上面功能很弱,因此deferred是专门针对回调函数提出来的。
二:ajax的写法
1;常见的ajax的写法: ajax 默认返回的就是一个promise对象
$.ajax({2.引入deferred的写法:
url: 'test.html',
success:function(data){ alert('successs') },
error: function(){ alert('faile') }
})
可以看到在高版本中采用链式写法后,可读性更加的高。$.ajax('test.html')
.done(function(){ alert('success')})
.fail(function(){ alert('faile') });
三:指定统一操作的多个函数
deferred 对象的一大好处,就是它允许你自由添加多个回调函数。
/ / 还是上面的例子,如果想在完成后再执行一个函数,写法是这个样子的四: 为多个操作指定回调函数
$.ajax("test.html")
.done(function(){ alert('success') })
.fail(function(){ alert( 'faile' )})
.done( function(){ alert('这个是ajax完成后再执行的一个函数')} )
允许为多个事件指定一个回调函数,而这个是传统方法无法做到的。$.when() 它的对象必须是deferred对象
五:普通操作的回调函数接口$.when( $.ajax('test1.html'),$,ajax('test2.html'))
.done(function(){ })
.error(function(){ })
eferred对象的最大优点,就是它把这一套回调函数接口,从ajax操作扩展到了所有操作。也就是说,任何一个操作----不管是ajax操作还是本地操作,也不管是异步操作还是同步操作----都可以使用deferred对象的各种方法,指定回调函数
注意:1:任意一个deferred对象有三种执行状态----未完成,已完成和已失败
2:dtd.promise() 的目的,就是保证目前的执行状态----也就是"未完成"----不变,从而确保只有操作完成后,才会触发回调函数
3:当操作完成后,必须手动改变Deferred对象的执行状态,否则回调函数无法触发。dtd.resolve()的作用,就是将dtd的执行状态从"未完成"变成"已完成",从而触发done()方法
我们来看一个很耗时间的例子:
var wait = function(){除了使用$.when()为普通操作添加回调函数,还可以使用deferred对象的建构函数$.Deferred()。这时,wait函数还是保持不变,我们直接把它传入$.Deferred():
function sec(){
alert('success');
}
setInterval(sec,10000);
}
wait();
// 改写过程:
var dtd = $.Deferred();
var wait = function(dtd){
var tasks = function(){
alert('success');
dtd.resolve(); // 改变deferred 对象的执行状态
}
setInterval(tasks,5000);
return dtd.promise();
}
$.when(wait(dtd))
.done(function(){ alert('哈哈,加载成功了') })
.fail(function(){ alert('哈哈,加载是被了') })
// 或者使用
$.Deferred(wait)
.done(function(){ alert("哈哈,成功了!"); })
.fail(function(){ alert("出错啦!"); });
六 小结
前面已经讲到了deferred对象的多种方法,下面做一个总结:
(1)$.Deferred() 生成一个deferred对象。
(2)deferred.done() 指定操作成功时的回调函数
(3)deferred.fail() 指定操作失败时的回调函数
(4)deferred.promise() 没有参数时,作用为保持deferred对象的运行状态不变;接受参数时,作用为在参数对象上部署deferred接口。
(5)deferred.resolve() 手动改变deferred对象的运行状态为"已完成",从而立即触发done()方法。
(6)$.when() 为多个操作指定回调函数。
除了这些方法以外,deferred对象还有三个重要方法,上面的教程中没有涉及到。
(7)deferred.then()
有时为了省事,可以把done()和fail()合在一起写,这就是then()方法。
$.when($.ajax( "/main.php" ))
.then(successFunc, failureFunc );
如果then()有两个参数,那么第一个参数是done()方法的回调函数,第二个参数是fail()方法的回调方法。如果then()只有一个参数,那么等同于done()。
(8)deferred.reject()
这个方法与deferred.resolve()正好相反,调用后将deferred对象的运行状态变为"已失败",从而立即触发fail()方法。
(9)deferred.always()
这个方法也是用来指定回调函数的,它的作用是,不管调用的是deferred.resolve()还是deferred.reject(),最后总是执行。
$.ajax( "test.html" )
.always( function() { alert("已执行!");} );$(document).ready(function(){
function wait(){
var def = $.Deferred();
setTimeout(function(){
alert('222');
def.resolve();
},2000);
//return def.promise();
//return def.reject('abc'); // 拒绝延迟对象
return def.rejectWith($('div'),['ok']); // 第一个是上下文的环境 第二个数数组
}
$.when(wait())
.done(function(){ alert('1111') })
.fail(function(val){
// this默认是指定这个定义的函数wait对象
$(this).append('abc')
alert(val); // ok 就是要传递的值在这个里面
});
})
- jQuery --deferred 延迟对象
- jquery deferred延迟对象处理
- 关于JQuery中的Deferred延迟操作对象
- twisted中的延迟对象deferred
- 详解Jquery deferred 对象
- jQuery.Deferred对象
- jQuery的deferred对象
- jquery 的deferred对象
- jQuery的deferred对象
- jQuery的Deferred对象
- jQuery - Deferred 对象使用
- jQuery的deferred对象
- jQuery的deferred对象
- jQuery的deferred对象
- jQuery Deferred对象
- JQuery Deferred 对象
- jquery的deferred对象
- JQuery的Deferred对象
- angular 6
- laravel之 Request and response
- php string9
- window 怎样创建和快速切换虚拟桌面
- 10.file
- jQuery --deferred 延迟对象
- iOS 自定义步骤实时进度条
- jquery 不常用但重要的api
- js数据类型-re(1)
- 有序链表
- css小杂碎
- Android AIDL分析
- 面向对象3
- js之少用但很重要的语法