jQuery.extend({
/*
* deferred对象的一大好处,就是它允许你自由添加多个回调函数。
* $.ajax("test.html")
.done(function(){ alert("哈哈,成功了!");} )
.fail(function(){ alert("出错啦!"); } )
.done(function(){ alert("第二个回调函数!");} );
*deferred对象的另一大好处,就是它允许你为多个事件指定一个回调函数,这是传统写法做不到的。
当两个操作都成功了才执行成功的回调函数,否则执行失败的回调函数
$.when($.ajax("test1.html"), $.ajax("test2.html"))
.done(function(){ alert("哈哈,成功了!"); })
.fail(function(){ alert("出错啦!"); });
*deferred对象的最大优点,就是它把这一套回调函数接口,从ajax操作扩展到了所有操作。
也就是说,任何一个操作----不管是ajax操作还是本地操作,也不管是异步操作还是同步操作----
都可以使用deferred对象的各种方法,指定回调函数。
*deferred对象有三种执行状态----未完成,已完成和已失败。
*/
Deferred: function( func ) {
var tuples = [
// action, add listener, listener list, final state
//不同动作、监听、回调、最终状态组织起来的一个数组,将用它生成三组事件监听方法
[ "resolve", "done", jQuery.Callbacks("once memory"), "resolved" ],
[ "reject", "fail", jQuery.Callbacks("once memory"), "rejected" ],
[ "notify", "progress", jQuery.Callbacks("memory") ]
],
state = "pending",
// 返回当前的执行状态
promise = {
state: function() {
return state;
},
// 不管执行状态是resolve还是reject,都执行回调。
always: function() {
// deferred是在该回调函数中定义的一个对象(后面),它将作为返回值被返回,大部分方法将被绑定在该对象中
deferred.done( arguments ).fail( arguments );
return this;
},
// 参数可传入三个函数,第一个是成功的回调,第二个是失败的回调,第三个。。呃。。
// 这个方法有些迷惑。。
then: function( /* fnDone, fnFail, fnProgress */ ) {
var fns = arguments;
// 递归调用jQuery.Deferred()方法,并传入func。这些func将被加入回调列表中
return jQuery.Deferred(function( newDefer ) {
jQuery.each( tuples, function( i, tuple ) {
var action = tuple[ 0 ],
//判断参数是不是函数,如果是就赋值给fn,第一参数对应done,第二个参数对应fail,。。。
fn = jQuery.isFunction( fns[ i ] ) && fns[ i ];
deferred[ tuple[1] ](function() {
//这里的this指,调用done、fail的对象,arguments指调用时传入的参数,比如函数。
var returned = fn && fn.apply( this, arguments );
if ( returned && jQuery.isFunction( returned.promise ) ) {
returned.promise()
.done( newDefer.resolve )
.fail( newDefer.reject )
.progress( newDefer.notify );
} else {
newDefer[ action + "With" ]( this === promise ? newDefer.promise() : this, fn ? [ returned ] : arguments );
}
});
});
fns = null;
}).promise();
},
// 提供一个方法将promise对象扩展到obj对象上。如果没有obj对象,则直接返回promise对象。
promise: function( obj ) {
return obj != null ? jQuery.extend( obj, promise ) : promise;
}
},
// 所有封装的方法都会绑定到该对象上返回
deferred = {};
//为了向后兼容,以前都是用promise.pipe?
promise.pipe = promise.then;
// 遍历之前定义的动作、监听、回调、最终状态组成的数组,进行初始化操作
jQuery.each( tuples, function( i, tuple ) {
// 取得数组当中的 jQuery.Callbacks("once memory"),并将执行结果赋值给list。
var list = tuple[ 2 ],
//取出数组中的表示最终状态的字符串 “resolved rejected”
stateString = tuple[ 3 ];
//将list,也就是jQuery.Callback()方法返回的self对象中的add方法,绑定到promise.resolve/reject/notify上
promise[ tuple[1] ] = list.add;
// 如果stateString有值,以为数组中的第三个小数组中是没有最终状态值的,所以需要if做判断
if ( stateString ) {
// 调用Callbask返回的对象中的add方法,向回调列表中增加三个回调方法:一个匿名函数(改变最终状态),一个disable,一个lock
list.add(function() {
// state = [ resolved | rejected ]
state = stateString;
// [ reject_list | resolve_list ].disable; progress_list.lock
}, tuples[ i ^ 1 ][ 2 ].disable, tuples[ 2 ][ 2 ].lock );
}
//将resolve()、reject()、notify()方法绑定到deferred对象上并暴露出来提供给用户调用
deferred[ tuple[0] ] = function() {
//调用deferred.resovleWith/rejectWith/notifyWith方法,这些方法是在下面定义的
deferred[ tuple[0] + "With" ]( this === deferred ? promise : this, arguments );
return this;
};
//将jQuery.Callback()方法返回的self对象中的fireWith方法绑定到deferred.resovleWith/rejectWith/notifyWith上
deferred[ tuple[0] + "With" ] = list.fireWith;
});
// 将promise对象所有的方法和属性扩展到deferred对象上,使之具有promise所具有的方法和属性,但promise中并不会包含一些不想暴露的方法,所以使用时,可以返回deferred.promise对象
promise.promise( deferred );
//如果有传入的func,则在deferred对象执行环境执行func,支持另外一种使用Deferred的方法。例如:$.Deferred( function(){} );
if ( func ) {
func.call( deferred, deferred );
}
// 返回deferred对象
return deferred;
},
//多个方法全都执行完毕后,执行回调函数
when: function( subordinate /* , ..., subordinateN */ ) {
......
}
});