通过对Callbacks 的了解,也知道了通过Callback怎么来实现异步回调(也可以称为延迟回调)。
上一节末,提到了一个问题,在延迟(异步)操作中,会面临成功、失败两种肯能性。也给出了用Callbacks来处理这两种情形的解决方案。但是觉得太麻烦了。这一节就用Deferred来解决该问题。
Deferred,是jQuery为我们提供更加强大的基于Callbacks实现的延迟处理(异步处理)工具。使用它可以很方便的解决前面的问题。此外要说明的是,Deferred在Python,Java,Dojo中都有同样的类库,有兴趣的童鞋可以了解一下。
其实呢,在Deferred的内部,是有三个Callbacks对象的:doneCallbacks (成功时使用的回调链), failCallbacks(失败时使用的回调链), progressCallbacks(处理进度的回调链)。
不管是使用Callbacks,还是使用Deferred,都不可避免的有两个过程:1)注册回调函数,2)触发回调。Deferred中既然有了这三个Callbacks,那么自然就有了与之对应的注册函数,触发回调的函数。
注册方法 | 触发方法 | |
doneCallbacks | done(failCbs) | resolve resolveWith |
failCallbacks | fail(failCbs) | reject rejectWith |
progressCallbacks | progress(progressCbs) | notify notifyWith |
通用的 | then(doneCbs,failCbs,progCbs) | |
Always(cbs) 不论成功或失败都会调用 |
上面的注册方法,底层就是调用的Callbacks对象的add方法,同理resolve方法底层就是调用的是Callbacks对象的fire,fireWith方法。
下面用Deferred来实现延迟回调:
$(function(){ ???????????????function fn1(value){ ???????????????????console.log(arguments.length,value); ???????????????} ???????????????function fn2(value){ ???????????????????return "fn2, " + value; ???????????????} ???????????????function fn3(value){ ???????????????????fn1(fn2(value)); ???????????????} ???????????????debugger; ???????????????var deferred = jQuery.Deferred(function(deferred){ ???????????????????????????????????var success = new Date().getTime()/2==1; ???????????????????if(success){ ???????????????????????deferred.resolve("success"); ???????????????????}else{ ???????????????????????deferred.reject("fail"); ???????????????????} ???????????????}); ???????????????????????????????deferred.done(fn1).fail(fn3); ???????????????????????????????????????????});
在开发中,我们可能会遇到更加复杂的情况,需要执行多个延迟操作,然后根据这多个延迟操作的结果进行回调处理。此时该如何应对呢?
$(function(){ ???????????????function fn1(value){ ???????????????????console.log(arguments.length,value); ???????????????} ???????????????function fn2(value){ ???????????????????return "fn2, " + value; ???????????????} ???????????????function fn3(value){ ???????????????????fn1(fn2(value)); ???????????????} ???????????????var deferred1 = jQuery.Deferred(function(deferred){ ???????????????????????var success = new Date().getTime()/2==1; ???????????????????????if(success){ ???????????????????????????deferred.resolve("success"); ???????????????????????}else{ ???????????????????????????deferred.reject("fail"); ???????????????????????} ???????????????????}); ???????????????????????????????var deferred2 = jQuery.Deferred(function(deferred){ ???????????????????????var success = new Date().getTime()/3==0; ???????????????????????if(success){ ???????????????????????????deferred.resolve("success"); ???????????????????????}else{ ???????????????????????????deferred.reject("fail"); ???????????????????????} ???????????????????}); ???????????????????????????????????var deferred = jQuery.when(deferred1, deferred2); ???????????????????????????????deferred.done(fn1).fail(fn3); ???????????????????????????????????????});
jQuery: Deferred
原文地址:http://www.cnblogs.com/f1194361820/p/7608849.html