jQuery的延遲物件

2022-04-03 04:44:21 字數 4041 閱讀 1542

之前看別人的demo,發現在延遲物件被resolve時要執行的**,有時會寫在deferred.then方法裡執行,有時會寫在deferred.done方法裡執行。

這讓對延遲物件一知半解的我非常困惑,今天抽時間研究了一下下,發現:在某種環境下,兩個方法的確能實現同樣的效果。

這種特定的環境是怎樣呢?

先看一下deferred.done的用法:

// 建立deferred物件

var dtd = $.deferred();

// 解決deferred物件

dtd.resolve('finish');

// 呼叫done方法

dtd.done(donecallback [, donecallback])

// 當deferred物件被 resolve 時,執行donecallback函式

// 引數可為乙個函式、多個函式或函式陣列

// 返回原來的deferred或promise物件

再看下deferred.then的用法和特性: 

// 建立deferred物件

var dtd = $.deferred();

// 解決deferred物件

dtd.resolve('finish');

// 呼叫then方法

deferred.then(donefilter [, failfilter] [, progressfilter])

// then方法特性:

// 當deferred物件被resolve時,執行donefilter函式

// 當deferred物件被reject時,執行failfilter函式

// 當dederred物件被progress時,執行progressfilter函式

// 返回值:1,返回deferred的promise物件,可修改promise傳遞的值( 原來resolve,reject 的返回值為a,將a修改為b,返回b,該promise的done或fail收到的返回值變為b );

// 返回值:2,在then方法內建立新的deferred物件並返回其promise

// 返回的promise物件可以鏈結其他的延遲物件,如done,fail,then等

// 多個then方法時,非同步執行( one by one )

// 該方法會過濾掉deferred修改狀態的方法,返回值deferred物件的promise

根據以上兩個方法的特性,發現:

deferred.then和deferred.done方法都可以直接收乙個引數函式,且第乙個引數函式都是在deferred物件在resolve時被呼叫。

雖說then方法可改變返回值,但在不考慮返回值且只有乙個引數函式的前提下,兩個方法的確可以實現一樣的效果。

相比之下,done方法更純粹吧,then方法會更複雜一些,但不能完全替代done方法,使用then方法的話,還是小心些的好。

附deferred物件的其它方法:

// 建立延遲物件 

var dtd = $.deferred();

var state = dtd.state();

// 返回deferred物件當前狀態,pending / resolved / rejected

// 不接受任何引數

deferred.always( alwayscallback [, alwayscallback] );

// 當deferred物件被解決或拒絕時,都執行此方法

// 引數可以是乙個函式,或是乙個函式陣列

dtd.promise( [obj] );

// 目的: 防止其他**干涉其內部進度和狀態

// 返回新的promise物件,包含可以執行的方法( done, fail, then, always, progress, state, promise ),

// 不包含修改deferred狀態的方法( resolve, reject, notify, resolvewith, rejectwith, nodifywith )

// 需返回deferred物件時,建議返回deferred.promise()

dtd.resolve( [args] )

// 解決deferred物件,呼叫所有donecallback函式

// donecallback可通過then方法中第乙個引數設定,也可通過dtd.done( donecallback )新增

// 引數將傳遞給donecallback。引數可選

// 只有deferred物件的建立者才可以呼叫的方法

// donecallback中this為deferred或promise物件

// donecallback只接收乙個引數

dtd.resolvewith( context [,args] )

// 解決deferred物件,呼叫所有donecallback函式

// 引數:第乙個引數為上下文即this物件,donecallback的this將被修改;第二個引數為陣列

// donecallback中this為呼叫resolvewith方法的上下文

// donecallback接收引數個數為該方法第二個引數陣列的長度

// 與resolve方法的區別在於,將改變donecallback函式的this指向

dtd.reject( [args] )

// 拒絕deferred物件,呼叫所有failcallback函式

// failcallback可通過then方法中第二個引數設定,也可通過dtd.fail( failcallback )新增

// 引數將傳遞給failcallback。引數可選

// 只有deferred物件的建立者才可以呼叫的方法

// failcallback中this為deferred或promise物件

// failcallback只接收乙個引數

dtd.rejectwith(context,  [args] )

// 解決deferred物件,呼叫所有failcallback函式

// 引數:第乙個引數為上下文即this物件,failcallback的this將被修改;第二個引數為陣列

// failcallback中this為呼叫rejectwith方法的上下文

// failcallback接收引數個數為該方法第二個引數陣列的長度

// 與resolve方法的區別在於,將改變failcallback函式的this指向

dtd.notify( [args] )

// deferred進行處理時,呼叫所有的progresscallback函式

// progresscallback可通過then方法中的第3個引數設定,也可以通過deferred.progress( progresscallback )新增

// 通常此方法只能被deferred物件的建立者呼叫,可通過deferred.promise或then過濾此方法

// 引數可不寫。若寫有引數,建議為字串或可返回字串的函式

// 當deferred進入 resolved 或rejected狀態後,再呼叫notify方法,progresscallback將不再被執行

dtd.notifywith(context,  [args] )

// deferred進行處理時, 呼叫所有progresscallback函式

// 引數:第乙個引數為上下文即this物件,progresscallback的this將被修改;第二個引數為陣列

// progresscallback中this為呼叫rejectwith方法的上下文

// progresscallback接收引數個數為該方法第二個引數陣列的長度

// 與resolve方法的區別在於,將改變progresscallback函式的this指向

// 當deferred進入 resolved 或rejected狀態後,再呼叫notifywith方法,progresscallback將不再被執行

jquery 延遲執行例項介紹

function delay 1500 queue function 以上 讓頁面中的按鈕在頁面載入後500毫秒隱藏,然後再過1500毫秒顯示出來。如下 function delay 1500 show 1 queue function 以上 效果與前面的 相同。如下 function delay ...

Jquery物件 jquery與dom物件的區別

最近工作有很多判斷的 用到了jquery與dom物件的地方比較多,寫在這裡加強下基本概念 1.判斷是否存在時候,要用dom物件,因為jquery在獲得物件的時候,無論要獲得的物件是否存在,都會返回jquery物件 2.jquery物件與dom物件的轉換 jquery物件就是通過jquery包裝dom...

使用JQuery實現延遲載入UserControl

延遲載入usercontrol這個需求,我們有時保證元件靈活性,需要動態加態usercontrol 其實這實現並不難 此處我們用jquery呼叫webservice來實現延遲載入usercontrol 有乙個usercontrol是讀取cnn的rss,然後展示出來 1 control languag...