站長資訊網
        最全最豐富的資訊網站

        jquery延遲對象是什么

        jquery延遲對象是“Deferred”,是通過調用jQuery.Deferred()方法來創建的可鏈接的實用對象。延遲對象是可鏈接的,類似于一個jQuery對象可鏈接的方式,區別于它有自己的方法;它可注冊多個回調函數到回調列表,調用回調列表并且傳遞異步或同步功能的成功或失敗的狀態。

        jquery延遲對象是什么

        前端(vue)入門到精通課程:進入學習
        Apipost = Postman + Swagger + Mock + Jmeter 超好用的API調試工具:點擊使用

        本教程操作環境:windows7系統、jquery3.6.1版本、Dell G3電腦。

        jQuery 1.5中介紹了 Deferred 延遲對象,它是通過調用 jQuery.Deferred() 方法來創建的可鏈接的實用對象。它可注冊多個回調函數到回調列表,調用回調列表并且傳遞異步或同步功能的成功或失敗的狀態。

        延遲對象是可鏈接的,類似于一個 jQuery 對象可鏈接的方式,區別于它有自己的方法。在創建一個 Deferred 對象之后,您可以使用以下任何方法,直接鏈接到通過調用一個或多個的方法創建或保存的對象。

        列表

        函數 說明
        $.Deferred() 用來返回一個鏈式實用對象方法來注冊多個回調,并且調用回調隊列,傳遞任何同步或異步功能成功或失敗的狀態。
        deferred.always() 用于當Deferred(延遲)對象被受理或被拒絕時,調用添加的處理程序
        deferred.done() 用于當Deferred(延遲)對象被受理時,調用添加的處理程序
        deferred.fail() 用于當 Deferred (延遲)對象被拒絕時,調用添加的處理程序
        deferred.progress() 用于當Deferred(延遲)對象生成進度通知時,調用添加處理程序
        deferred.isRejected()1.8- 用來確定 Deferred 對象是否已被拒絕
        deferred.isResolved()1.8- 用來確定 Deferred 對象是否已被拒絕
        deferred.notify() 用于傳遞參數給進行中的回調
        deferred.notifyWith() 用于傳遞參數,上下文對象給進行中的回調
        deferred.reject() 用于拒絕延遲對象,并傳遞參數給失敗回調函數
        deferred.rejectWith() 用于拒絕延遲對象,并傳遞參數和上下文對象給失敗回調函數
        deferred.resolve() 用于解決延遲對象,并并傳遞參數給doneCallbacks 回調函數
        deferred.resolveWith() 用于解決延遲對象,并并傳遞參數和上下文對象給doneCallbacks 回調函數
        deferred.state() 用于確定一個Deferred(延遲)對象的當前狀態
        deferred.pipe() 用于過濾狀態或通過函數返回的延遲對象的值
        deferred.then() 用于當Deferred(延遲)對象被解決,拒絕或仍在進行中時,調用添加處理程序。
        deferred.catch() 用于當Deferred對象被拒絕(reject)時,調用添加的處理程序。
        deferred.promise() 用于返回 Deferred(延遲)的 Promise 對象
        .promise() 用于返回一個 Promise 對象,觀察某種類型被綁定到集合的所有行動,是否已被加入到隊列中。

        說明

        $.Deferred()

        $.Deferred() 是一個構造函數,用來返回一個鏈式實用對象方法來注冊多個回調,并且調用回調隊列,傳遞任何同步或異步功能成功或失敗的狀態。

        提示:

        • $.Deferred() 構造函數創建一個新的 Deferred(延遲)對象, jQuery.Deferred
          可傳遞一個可選的函數,該函數在構造方法返回之前被調用并傳遞一個新的 Deferred 對象作為函數的第一個參數。例如被調用的函數可以使用 deferred.then()來附加回調函數。
        • 一個 Deferred 對象開始于掛起狀態。任何使用 deferred.then(), deferred.always(),
          deferred.done(), 或者 deferred.fail() 添加到這個對象的回調函數都是排隊等待執行的。

        調用 deferred.resolve() 或 eferred.resolveWith() 轉換延遲到解決狀態后立即執行設置的
        doneCallbacks 。
        調用 deferred.reject() 或 deferred.rejectWith() 轉換延遲到拒絕狀態后立即執行設置的 failCallbacks 。一旦對象已經進入了解決或拒絕狀態,它保持該狀態。回調仍然可以添加到已解決或已拒絕的 Deferred 對象——它們會立即執行。

        語法

        • $.Deferred( [beforeStart ] )

        jQuery1.5新增該函數

        參數說明

        參數 說明
        beforeStart Function類型 個在構造函數返回之前調用的函數

        返回值

        jQuery.Deferred()工廠函數創建一個新的deferred對象。


        deferred.always()

        當Deferred(延遲)對象被受理或被拒絕時,調用通過deferred.always() 添加的處理程序。

        提示:參數可以是一個函數或一個函數數組。由于 deferred.always() 返回的是一個 Deferred 對象,所以可以連接其他的延遲對象方法(這里是指可以繼續調用Deferred對象的方法),包括額外的 .always 方法。 當 Deferred 對象得到解決或被拒絕時,通過deferred.always() 添加的回調函數按它們被添加時的順序執行,并且可以作為參數傳遞給如下的方法使用:resolve , reject , resolveWith 或 rejectWith。

        語法

        • deferred.always( alwaysCallbacks [, alwaysCallbacks ] )

        jQuery1.6新增該函數

        參數說明

        參數 說明
        alwaysCallbacks 可選/Function類型 一個函數或者函數數組,當Deferred(延遲)對象得到解決或被拒絕時被調用

        注意: deferred.always()方法接收了Deferred對象.resolve()或.reject()使用的參數, 這往往是非常不同的。 為此, 最好的只用它的行為,而不去檢查他的參數。 在大多數情況下, 使用顯式 .done() 或 .fail()處理程序,因為他們的參數都是已知的。

        返回值

        deferred.always()返回Deferred(延遲)對象

        示例&說明

        jQuery.get()方法返回一個來自一個Deferred(延遲)對象的jqXHR對象,我們可以附加一個成功和錯誤使用deferred.always()方法的回調,jQuery示例代碼:

         $.get( "test.php" ).always(function() {     alert( "帶有成功和錯誤的回調參數的$.get方法已完成。" );  })
        登錄后復制


        deferred.done()

        當Deferred(延遲)對象被受理時,調用通過延遲對象函數deferred.done()添加的處理程序。

        提示:該方法接受一個或者多個參數。deferred.done() 返回的是一個 Deferred 對象, 可以連接其他的延遲對象方法(繼續調用Deferred 對象的方法),包括額外的 .done() 方法。當Deferred 對象得到解決時,通過deferred.done()添加的回調函數按它們被添加時的順序執行,并且可以作為參數傳遞給如下的方法使用:resolve,resolveWith。

        語法

        • deferred.done( doneCallbacks [, doneCallbacks ] )

        jQuery1.5新增該函數

        參數說明

        參數 說明
        doneCallbacks 可選/Function類型 一個函數或者函數數組,當Deferred(延遲)對象得到解決時被調用

        返回值

        deferred.done() 返回的是一個 Deferred 對象

        示例&說明

        HTML示例代碼:

         <button>Go</button>  <p>Ready...</p>
        登錄后復制

        jQuery示例代碼

        function fn1() {   $("p").append(" 1 "); } function fn2() {   $("p").append(" 2 "); } function fn3(n) {   $("p").append(n + " 3 " + n); }  var dfd = $.Deferred();//創建一個延遲對象  //添加dfd被解決時需要的被調用的處理函數 dfd .done( [fn1, fn2], fn3, [fn2, fn1] )// 連接一個函數或者函數數組 .done(function(n) {//可以連接其他的方法   $("p").append(n + " we're done."); });  //當點擊按鈕時修改延遲對象的狀態為已解決 //此時調用通過deferred.done()添加的延遲對象被受理后的處理函數 $("button").bind("click", function() {   dfd.resolve("and");//輸出:1 2 and 3 and 2 1 and we're done. });
        登錄后復制


        deferred.fail()

        當 Deferred (延遲)對象被拒絕時,調用通過deferred.fail()添加的處理程序。

        提示:該方法接受一個或者多個參數。 deferred.fail() 返回的是一個 Deferred 對象, 可以連接其他的延遲對象方法(繼續調用其他Deferred 對象的方法),包括額外的 .fail() 方法。當 Deferred 對象被拒絕時,通過deferred.fail()添加的回調函數 按它們被添加時的順序執行,并且可以作為參數傳遞給如下的方法使用:deferred.resolve() 或 deferred.rejectWith()。

        語法

        • deferred.fail( failCallbacks [, failCallbacks ] )

        jQuery1.5新增該函數

        參數說明

        參數 說明
        failCallbacks 可選/Function類型 一個函數或者函數數組,當Deferred(延遲)對象被拒絕時被調用

        返回值

        deferred.fail() 返回的是一個 Deferred 對象

        示例&說明

        jQuery示例代碼

        $(function () {      $.get("test.php")         .done(function(){ alert("$.get 成功!"); })//解決時調用         .fail(function(){ alert("$.get 失敗!"); });//被拒絕時調用 })
        登錄后復制


        deferred.progress()

        deferred.progress() 函數當Deferred(延遲)對象生成進度通知時,調用添加處理程序。

        注意:當通過調用 notify 或 notifyWith 使延遲對象產生進度通知時,progressCallbacks 就會被調用。 由于 deferred.progress()返回的是延遲對象,所以其它延遲對象方法可以鏈接到該對象上(鏈式調用)。當延遲對象被 resolved 或 rejected 時, 進度回調函數將不再被調用,但是當Deferred (延遲)進入resolved(解決) 或 rejected(拒絕)狀態后,新添加任何的progressCallbacks將立即執行,使用的參數被傳遞給.notify() 或 notifyWith()調用

        語法

        • deferred.progress( progressCallbacks[,progressCallbacks] )

        jQuery 1.7 新增該函數

        參數說明

        參數 說明
        progressCallbacks 可選/Function類型 一個函數或者函數數組,當Deferred(延遲)對象生成正在執行中的進度通知時被調用。

        返回值

        deferred.progress() 返回的是一個 Deferred 對象


        deferred.isRejected()

        deferred.isRejected() 函數用來確定 Deferred 對象是否已被拒絕。

        從jQuery1.7開始已經過時,請使用 deferred.state() 代替。

        注意:

        • 如果 Deferred(延遲)對象是在被拒絕的狀態,則返回 true。這意味著 deferred.reject() 或者deferred.rejectWith() 已經在對象上被調用過,并且 failCallbacks 已經被調用過(或者正處于被調用的階段)。
        • Deferred(延遲)對象可以有三種狀態:掛起(pending),解決(resolved),或拒絕(rejected);使用 deferred.isResolved() 來判斷延遲對象是否在解決狀態。

        語法

        • deferred.isRejected()

        jQuery 1.5 新增該函數,1.7過時,1.8移除

        返回值

        deferred.isRejected() 返回的是一個 Boolean類型


        deferred.isResolved()

        deferred.isResolved() 函數用來確定 Deferred 對象是否已被解決。

        從jQuery1.7開始已經過時,請使用 deferred.state() 代替。

        注意:

        • 如果 Deferred(延遲)對象是在被解決的狀態,則返回 true。這意味著 deferred.resolve() 或者 deferred.resolveWith() 已經在對象上被調用過,并且 doneCallbacks 已經被調用過(或者正處于被調用的階段)。
        • Deferred(延遲)對象可以有三種狀態:掛起(pending),解決(resolved),或拒絕(rejected);使用 deferred.isRejected() 來判斷延遲對象是否在拒絕狀態。

        語法

        • deferred.isResolved()

        jQuery 1.5 新增該函數,1.7過時,1.8移除

        返回值

        deferred.isResolved() 返回的是一個 Boolean類型


        deferred.notify()

        deferred.notify() 函數用于定一個參數,傳遞給正在調用的延遲對象上的回調函數 ( progressCallbacks )。

        注意:

        • 通常,只有延遲對象(Deferred)的創建者才能調用此方法。
        • 你可以通過調用 deferred.promise() 返回一個受限的 Promise 對象,來阻止其它代碼改變延遲對象的狀態或報告它的狀態。
        • 當 deferred.notify 被訪問時, 任何 progressCallbacks 可以通過訪問 deferred.then 或者 deferred.progress 來添加。回調依照他們添加時的順序執行。

        通過來自.notify()的傳遞參數給正在調用的延遲對象上的回調函數,當遲延對象已經被
        resolved 或被 rejected 之后,再調用任何 .notify() (或者添加 progressCallbacks) 都會
        被忽略

        語法

        • deferred.notify( args )

        jQuery 1.7 新增該函數

        參數說明

        參數 說明
        args 可選/Object類型 傳遞一個可選的參數給進行中的回調(progressCallbacks)

        返回值

        deferred.notify() 返回的是一個 Deferred 對象

        小知識

        jQuery提供的deferred.promise()方法的作用是,在原來的Deferred 對象上返回另一個 Deferred 對象,即受限制的 Promise 對象,受限制的 Promise 對象只開放與改變執行狀態無關的方法(比如done()方法和fail()方法),屏蔽與改變執行狀態有關的方法(比如resolve()方法和reject()方法),從而使得執行狀態不能被改變。

        首先看一個 Deferred對象的執行狀態被改變的例子:

        var dtd = $.Deferred(); // 新建一個Deferred對象 var wait = function(dtd){   var tasks = function(){     alert("執行完畢!");     dtd.resolve(); // 改變Deferred對象的執行狀態   };   setTimeout(tasks,5000);   return dtd; }; $.when(wait(dtd)) .done(function(){ alert("等待執行!"); }) .fail(function(){ alert("出錯啦!"); }); //代碼的尾部加了一行dtd.resolve(),這就改變了dtd對象的執行狀態,因此導致done()方法立刻執行 dtd.resolve();// 改變Deferred對象的執行狀態
        登錄后復制

        再看一個 Deferred對象返回deferred.promise()的例子:

        var wait = function(){   var dtd = $.Deferred(); //在函數內部,新建一個Deferred對象   var tasks = function(){     alert("執行完畢!");     dtd.resolve(); // 改變Deferred對象的執行狀態   };    setTimeout(tasks,5000);   return dtd.promise(); // 返回promise對象 }; $.when(wait()) .done(function(){ alert("哈哈,成功了!"); }) .fail(function(){ alert("出錯啦!"); });
        登錄后復制

        wait()函數返回的是promise對象。dtd.promise().resolve()方法不存在,因此無法改變狀態,然后,我們把回調函數綁定在這個對象上面,而不是原來的deferred對象上面。

        這樣的好處是,無法改變promise對象的執行狀態,要想改變執行狀態,只能操作原來的deferred對象。


        deferred.notifyWith()

        deferred.notifyWith() 函數用于給定上下文和參數,傳遞給正在調用的延遲對象上進行的回調函數( progressCallbacks )。

        注意:

        • 通常,只有延遲對象(Deferred)的創建者才能調用此方法。
        • 你可以通過調用 deferred.promise() 返回一個受限的 Promise 對象,來阻止其它代碼改變延遲對象的狀態或報告它的狀態。
        • 當 deferred.notifyWith 被調用時, 任何 progressCallbacks 可以通過訪問 deferred.then 或者 deferred.progress 來添加。回調 依照他們添加時的順序執行。

        通過 .notifyWith() 傳遞參數給每個回調函數,當遲延對象已經被 resolved 或被
        rejected 之后,再調用任何 .notifyWith() (或者添加 progressCallbacks) 都會被忽略。

        語法

        • deferred.notifyWith( context [, args ] )

        jQuery 1.7 新增該函數

        參數說明

        參數 說明
        context Object類型 作為this對象,傳遞給進行中的回調(progressCallbacks)
        args Array類型 傳遞一個可選的參數給進行中的回調(progressCallbacks)

        返回值

        deferred.notifyWith() 返回的是一個 Deferred 對象


        deferred.reject()

        deferred.reject() 函數用于拒絕延遲對象,并根據給定的參數調用任何 failCallbacks 回調函數。

        注意:

        • 通常只有延遲對象的創建者才可以調用該方法。你可以通過調用 deferred.promise(),返回一個受限的 Promise 對象,來阻止其它代碼改變延遲對象的狀態或報告它的狀態。
        • 當延遲對象被 rejected 時,任何通過 deferred.then 或 deferred.fail 添加的 failCallbacks,都會被調用。回調函數按它們被添加時的順序執行。傳遞給 deferred.reject() 的 args 參數,會傳給每個回調函數。當延遲對象進入 rejected 狀態后,任何 failCallbacks 被添加時,就會被立刻執行,并帶上傳入給 .reject() 的參數。

        語法

        • deferred.reject( args )

        jQuery1.5新增該函數

        參數說明

        參數 說明
        args Object類型 傳遞一個可選的參數給失敗的回調(failCallbacks)

        返回值

        deferred.reject() 返回的是一個 Deferred 對象


        deferred.rejectWith()

        deferred.rejectWith() 函數用于拒絕延遲對象,并根據給定的 context 和 args 參數調用任何 failCallbacks 回調函數。

        注意:

        • 通常只有延遲對象的創建者才可以調用該方法。你可以通過調用 deferred.promise(),返回一個受限的 Promise 對象,來阻止其它代碼改變延遲對象的狀態或報告它的狀態。
        • 當延遲對象被 rejected 時,任何通過 deferred.then 或 deferred.fail 添加的 failCallbacks,都會被調用。回調函數按它們被添加時的順序執行。傳遞給 deferred.reject() 的 args 參數, 會傳給每個回調函數。當延遲對象進入 rejected 狀態后,任何 failCallbacks 被添加時,就會被立刻執行,并帶上傳入給 .reject() 的參數。

        語法

        • deferred.rejectWith( context [, args ] )

        jQuery1.5新增該函數

        參數說明

        參數 說明
        context Object類型 傳遞一個對象給失敗的回調(failCallbacks)
        args Array類型 傳遞一個可選的參數給失敗的回調(failCallbacks)

        返回值

        deferred.rejectWith() 返回的是一個 Deferred 對象


        deferred.resolve()

        deferred.resolve() 函數用于解決Deferred(延遲)對象,并根據給定的args參數給完成回調函數doneCallbacks 。

        注意:

        • 通常只有延遲對象的創建者才可以調用該方法。你可以通過調用 deferred.promise(),返回一個受限的 Promise 對象,來阻止其它代碼改變延遲對象的狀態或報告它的狀態。
        • 當延遲對象被 resolved 時,任何通過 deferred.then 或 deferred.done 添加的 doneCallbacks,都會被調用。回調函數按它們被添加時的順序執行。傳遞給 deferred.resolve() 的 args 參數, 會傳給每個回調函數。當延遲對象進入 resolved 狀態后,任何 doneCallbacks 被添加時,就會被立刻執行,并帶上傳入給 .resolve() 的參數。

        語法

        • deferred.resolve( args )

        jQuery1.5新增該函數

        參數說明

        參數 說明
        args Object類型 傳遞一個可選的參數給完成回調函數(doneCallbacks)

        返回值

        deferred.resolve() 返回的是一個 Deferred 對象


        deferred.resolveWith()

        deferred.resolveWith() 函數用于解決Deferred(延遲)對象,并根據給定的 context 和 args 參數給完成回調函數doneCallbacks 。

        注意:

        • 通常只有延遲對象的創建者才可以調用該方法。你可以通過調用 deferred.promise(),返回一個受限的 Promise 對象,來阻止其它代碼改變延遲對象的狀態或報告它的狀態。
        • 當延遲對象被 resolved 時,任何通過 deferred.then 或 deferred.done 添加的 doneCallbacks,都會被調用。回調函數按它們被添加時的順序執行。傳遞給 deferred.resolve() 的 args 參數, 會傳給每個回調函數。當延遲對象進入 resolved 狀態后,任何 doneCallbacks 被添加時,就會被立刻執行,并帶上傳入給 .resolve() 的參數。

        語法

        • deferred.resolveWith( context [, args ] )

        jQuery1.5新增該函數

        參數說明

        參數 說明
        context Object類型 傳遞上下文對象給完成回調函數(doneCallbacks)
        args Array類型 傳遞一個可選的參數給完成回調函數(doneCallbacks)

        返回值

        deferred.resolveWith() 返回的是一個 Deferred 對象


        deferred.state()

        deferred.state() 函數用于確定一個Deferred(延遲)對象的當前狀態。

        主要是用于調試,例如,在準備拒絕(reject)一個延遲對象前,判斷它是否已經處于 resolved 狀態。

        注意:
        deferred.state() 方法返回一個字符串,代表Deferred(延遲)對象的當前狀態。Deferred 對象可以在三種狀態之一:

        • pending” : Deferred 對象是尚未完成狀態 。
        • resolved” : Deferred 對象是在解決狀態,這意味著對象的 deferred.resolve() 或者
          deferred.resolveWith()已被調用并且 doneCallbacks 已被調用(或在被調用的過程中)
        • rejected” : Deferred 對象是在被拒絕的狀態,這意味著對象的 deferred.reject() 或者
          deferred.rejectWith() 已被調用并且 failCallbacks 已被調用(或在被調用的過程中) 。

        語法

        • deferred.state()

        jQuery1.7 新增該函數

        返回值

        deferred.state() 返回的是一個 String類型


        deferred.pipe()

        deferred.pipe() 函數用于過濾 and/or 鏈式延遲對象的工具方法。

        注意:從jQuery 1.8開始, deferred.pipe() 方法過時。使用 deferred.then() 代替它。

        從jQuery 1.8開始, deferred.pipe() 方法過時. 應該使用deferred.then() 代替它。

        deferred.pipe()方法返回一個新的Promise對象,用于過濾狀態或通過函數返回的延遲對象的值,傳遞給Promise對象對應的done()、fail() 方法
        doneFilter和failFilter函數過濾原先deferred(延遲)的解決/拒絕的狀態和值。
        從 jQuery 1.7開始,該方法還接受一個progressFilter函數,用來過濾任何訪問deferred(延遲)的notify或notifyWith 方法。

        這些過濾器可以隨著 pipe()返回的 promise 對象的 done()或fail() 回調函數的調用,返回一個新值,或返回其它可見對象(Deferred, Promise, 等等),這些可見對象傳遞了自身的解決(resolve) / 拒絕(reject)狀態和傳遞給 pipe promise 回調函數的返回的值

        如果將 null 作為過濾函數,或者不指定過濾函數,那么 pipe promise 被受理(resolve)或被拒絕(reject)時,會使用相同的值作為原始值。

        語法

        • deferred.pipe( [doneFilter ] [, failFilter ] )

        jQuery1.6新增該函數,1.8過時

        • deferred.pipe( [doneFilter ] [, failFilter ] [, progressFilter ] )

        jQuery1.7新增該函數,1.8過時

        參數說明

        參數 說明
        doneFilter Function類型 可選函數,當延遲得到解決時調用
        failFilter Function類型 可選函數,當延遲被拒絕時調用
        progressFilter Function類型 可選函數,當進度通知發送給Deferred(延遲)被調用

        返回值

        deferred.pipe() 返回的是一個 * Promise對象*

        示例&說明

        過濾解決值:

        var defer = $.Deferred(),    filtered = defer.pipe(function( value ) {//當延遲對象解決時被調用        // 傳遞給 pipe promise 回調函數的返回的值為10         return value * 2;     }); defer.resolve( 5 );//延遲對象被解決  調用pipe() return 10 filtered.done(function( value ) {//filtered 傳遞之前返回的值 10     alert( "值是(2*5 =) 10: " + value );//彈出框輸出:值是(2*5 =) 10:10 });
        登錄后復制

        過濾拒絕值:

        var defer = $.Deferred(), //延遲得到解決時調用回調函數為null //延遲得到拒絕的回調函數傳遞值value * 3 給Promise對象filtered 的fail的回調函數         filtered = defer.pipe( null, function( value ) {             return value * 3;         });      defer.reject( 6 );//延遲對象被拒絕 調用pipe() return 18     filtered.fail(function( value ) {      alert( "值是(3*6=)18:" + value );//彈出框輸出:值是(3*6 =) 18:18     });
        登錄后復制

        鏈任務(?)

        var request = $.ajax( url, { dataType: "json" } ),     chained = request.pipe(function( data ) {         //request返回值給url2         return $.ajax( url2, { data: { user: data.userId } } );     });      chained.done(function( data ) {         // 通過第一個請求取回data值提供給URL2     });
        登錄后復制


        deferred.then()

        deferred.then() 函數當Deferred(延遲)對象被解決/拒絕或仍在進行中時,調用添加處理程序。

        注意:

        • 如果沒有這種類型的回調是需要的,參數可以為 null 。或者使用.done(),.fail()或者 .progress()設置只有一種未經過濾的狀態或值的回調類型。
        • 從jQuery 1.8開始, 方法返回一個新的 promise ,可以通過一個函數過濾延遲對象的狀態和值,用來替換現在過時的deferred.pipe() 方法。
        • 回調是依照他們被添加時的順序執行的,由于 deferred.then 返回 Promise 對象,可以鏈接其它的 Promise 對象,包括附加的 .then() 方法。

        doneFilter 和 failFilter函數過濾原延遲對象的解決/拒絕的狀態和值。
        progressFilter 函數過濾任何調用原有的延遲對象的notify 和 notifyWith的方法。
        這些過濾器函數可以返回一個新的值傳遞給的 Promise 對象的.done() 或 .fail() 回調,或他們可以返回另一個觀察的對象(延遲對象,Promise 對象等)傳遞給它的解決/拒絕的狀態和值,Promise 對象的回調。
        如果過濾函數是空,或沒有指定,promise(承諾)將得到與原來值相同解決(resolved)或拒絕(rejected)。

        語法

        • deferred.then( doneFilter [, failFilter ] [, progressFilter ] )

          jQuery1.8新增該函數

        • deferred.then1.8-( doneCallbacks, failCallbacks)

          jQuery1.5新增該函數,1.8移除

        • deferred.then1.8-( doneCallbacks, failCallbacks[, progressFilter ] )

          jQuery1.7新增該函數,1.8移除

        參數說明

        參數 說明
        doneFilter Function類型 可選 當Deferred(延遲)對象得到解決時被調用的一個函數
        failFilter Function類型 可選 當Deferred(延遲)對象得到拒絕時被調用的一個函數
        progressFilter Function類型 可選 當Deferred(延遲)對象生成進度通知時被調用的一個函數調用
        doneCallbacks Function類型 當Deferred(延遲)對象得到解決時被調用的一個函數或函數數組
        failCallbacks Function類型 當Deferred(延遲)對象得到拒絕時被調用的一個函數或函數數組
        progressCallbacks Function類型 當Deferred(延遲)對象生成進度通知時被調用的一個函數或函數數組

        返回值

        deferred.then() 返回 Promise 對象

        示例&說明

        HTML代碼:

        <button>過濾解決值</button> <p></p>
        登錄后復制

        過濾解決值:

        var filterResolve = function() {     var defer = $.Deferred(),         //當延遲對象解決時被調用         //過濾解決值給then()的返回Promise對象的完成回調函數         filtered = defer.then(function( value ) {             return value * 2;         });      defer.resolve( 5 );      //添加Promise對象的完成回調函數     filtered.done(function( value ) {         $( "p" ).html( "值是 ( 2*5 = ) 10: " + value );     }); }; $( "button" ).on( "click", filterResolve );
        登錄后復制

        過濾拒絕值:

        var defer = $.Deferred(), //延遲得到解決時調用回調函數為null //延遲得到拒絕的,回調函數過濾拒絕值  //傳遞過濾的拒絕值 value * 3 給then()的返回Promise對象的拒絕回調函數fail         filtered = defer.then( null, function( value ) {             return value * 3;         });      defer.reject( 6 );//延遲對象被拒絕 調用then() return 18      //then()的返回Promise對象添加拒絕回調函數,并獲取過濾的拒絕值     filtered.fail(function( value ) {      alert( "值是(3*6=)18:" + value );//彈出框輸出:值是(3*6 =) 18:18     });
        登錄后復制

        鏈任務(?)

        var request = $.ajax( url, { dataType: "json" } ),     chained = request.then(function( data ) {         //request返回值給url2         return $.ajax( url2, { data: { user: data.userId } } );     });      chained.done(function( data ) {         // 通過第一個請求取回data值提供給URL2     });
        登錄后復制


        deferred.catch()

        當Deferred對象被拒絕(reject)時,調用通過deferred.catch()添加的處理程序。

        deferred.catch( fn ) 是 deferred.then( null, fn )的一個別名

        語法

        • deferred.catch( failCallbacks )

        jQuery 3.0 新增該函數

        參數說明

        參數 說明
        failCallbacks Function類型 一個函數,當 Deferred 對象被拒絕(reject)時被調用

        返回值

        deferred.catch() 返回的是一個 Promise 對象

        示例&說明

        jQuery.get 方法返回一個jqXHR對象, 它是從Deferred對象派生的,當Deferred對象被拒絕(reject) 時,我們可以使用.catch方法來處理,jQuery示例代碼:

        $.get( "test.php" )   .then( function() {     alert( "$.get succeeded" );   } )   .catch( function() {     alert( "$.get failed!" );   } );
        登錄后復制


        deferred.promise()

        deferred.promise() 函數返回 Deferred(延遲)的 Promise 對象。

        注意:

        • 方法允許一個異步函數阻止那些干涉其內部請求的進度(progress)或狀態(status)的其它代碼。

        • Promise 對象只包含 deferred 對象的一組方法,包括:done(),then(),fail(),isResolved(), isRejected(), always(), 這些方法只能觀察一個 deferred 的狀態;不包括任何用于改變狀態的延遲方法(resolve, reject, notify, resolveWith, rejectWith, 和 notifyWith),因此Promise 對象無法更改 deferred 對象的內在狀態

        • deferred.promise()也可以接受一個 target 參數,此時傳入的 target 將被賦予 Promise 的方法,并作為結果返回,而不是創建一個新對象(這個方法可以用于在已經存在的對象上綁定 Promise 行為的情況)。

        語法

        • deferred.promise( [target ] )

        jQuery 1.5 新增該函數

        參數說明

        參數 說明
        target Object類型 綁定 promise 方法的對象。

        返回值

        deferred.promise() 返回的是一個 Promise 對象

        示例&說明

        創建一個延遲對象,并設定兩個延時時間是隨機的定時器,分別用于受理(resolve)和拒絕(reject)延遲對象。無論哪一個先執行,都會調用其中一個回調函數。而另一個定時器則不會產生任何效果,因為在最先調用的那個定時器處理中,延遲對象已經處于完成狀態(resolved 或 rejected 狀態)。同時,還會設定一個定時器進度(progress)通知函數,用于進度通知處理,并在文檔的 “body” 中顯示 “working…”,以下為一次測試時的jQuery示例代碼:

        function asyncEvent(){         var dfd = new jQuery.Deferred();          var resolveValue=400+Math.random()*2000;         var resolveTime=Math.floor(resolveValue)         console.log("resolveTime"+resolveTime)//resolveTime:1890ms          // 在一個隨機的時間間隔之后 Resolve (解決狀態)         setTimeout(function(){             dfd.resolve("歡呼");          }, Math.floor(resolveTime));          var rejectValue=400+Math.random()*2000;         var rejectTime=Math.floor(rejectValue)         console.log("rejectTime"+rejectTime)//rejectTime:1364ms          // 在一個隨機的時間間隔之后 reject (拒絕狀態)         setTimeout(function(){             dfd.reject("對不起");         },rejectTime);          // 每半秒顯示一個"working..."消息         setTimeout(function working(){             //"pending" : Deferred 對象是尚未完成狀態             //0ms 執行一次  500ms執行一次 1000ms執行一次             //1364ms 執行  dfd.reject("對不起")              //傳遞拒絕值"對不起" 給拒絕過濾函數 alert( status+', 這次你失敗了' );             if ( dfd.state() === "pending" ) {                 //向正在執行的Deferred 對象的回調函數列表傳遞參數                 dfd.notify("working... ");                  setTimeout(working, 500);             }         }, 1);          // 返回 Promise 對象,調用者不能改變延遲對象         return dfd.promise();     }     // 為異步函數附加一個done, fail, 和 progress 處理程序 //如果向 jQuery.when 傳入一個延遲對象,那么會返回它的 Promise 對象(延遲方法的一個子集)     $.when( asyncEvent() ).then(         function(status){             alert( status+', 事情進展順利' );         },         function(status){             alert( status+', 這次你失敗了' );         },         function(status){             $("body").append(status);         }     );
        登錄后復制

        使用目標參數,產生現有對象的Promise對象:

        // 現有對象     var obj = {         hello: function( name ) {             alert( "Hello " + name );         }     },     // 創建一個延遲 Deferred     defer = $.Deferred();     // 設置對象作為 promise     defer.promise( obj );     // Resolve (解決) 該對象     defer.resolve( "John" );     // 使用該對象作為 Promise,向受理列表中添加回調函數     //延遲對象狀態為解決,因此done 被調用     obj.done(function( name ) {         obj.hello( name ); //將彈出 "Hello John"     }).hello( "Karl" ); // 將彈出 "Hello Karl";
        登錄后復制


        .promise()

        .promise() 函數返回一個 Promise 對象,觀察某種類型被綁定到集合的所有行動,是否已被加入到隊列中。

        返回的 Promise 被鏈接到延遲對象上,保存在元素的 .data() 中。由于 .remove() 方法會移除元素上的 data,同時也會移除元素本身。所以,使用它會防止任何元素上未被受理的(unresolved) Promise 被受理(resolving)。如果有必要在元素的 Promise 被受理(resolved)之前,從 DOM 中移除該元素的話,請使用.detach() 來代替。之后再調用 .removeData()

        注意:

        • .promise() 方法返回一個動態生成的 Promise,當綁定到集合中的所有特定動作(action)已經被加入或未被加入到隊列中時,生成的 Promise 將被受理(resolve)。

        語法

        • .promise( [type ] [, target ] )

        jQuery 1.5新增

        參數說明

        參數 說明
        type 可選/String類型 需要待觀察隊列類型。
        target 可選/PlainObject類型 將要綁定 promise 方法的對象。

        默認情況下, type的值是”fx” ,這意味著返回被受理(resolve)的 Promise 對象的時機,是在所有被選中元素的動畫都完成時發生的。

        如果提供target參數,.promise()在該參數上添加方法,然后返回這個對象,而不是創建一個新的。它適用于在一個已經存在的對象上添加 Promise 行為的情況。

        返回值

        .promise()方法返回一個動態生成的 Promise對象

        示例&說明

        1.在一個沒有激活動畫的集合上調用 .promise()
        相關的jQuery示例代碼:

        //在一個沒有激活動畫的集合上調用 .promise(),返回一個被受理(resolved)的 Promise var div = $( "<div />" );     div.promise().done(function( arg1 ) {         //彈出 "true"         alert( this === div && arg1 === div );     });
        登錄后復制

        2.當所有的動畫結果時(包括那些在動畫回調函數和之后添加的回調函數中初始化的動畫),受理(Resolve)返回的 Promise,相關HTML代碼 :

        <style type="text/css"> //沒有樣式不易觀察執行效果,因此添加樣式設置     div{         height:100px;         width:200px;         border:2px solid #334455;         margin-top:2px;     } </style> <button>Go</button> <p>準備...</p> <div></div> <div></div> <div></div> <div></div>
        登錄后復制

        當所有的動畫結果時(包括那些在動畫回調函數和之后添加的回調函數中初始化的動畫),受理(Resolve)返回的 Promise,相關jQuery代碼

        $( "button" ).on( "click", function() {         $( "p" ).append( "已開始..." );          $( "div" ).each(function( i ) {             $( this ).fadeIn().fadeOut( 100 * ( i + 51 ) );         });          $( "div" ).promise().done(function() {             $( "p" ).append( " 完成! " );         });     });     //效果顯示好像是等動畫執行完成后才執行done()方法
        登錄后復制

        使用 $.when() 語句(.promise() 方法使得在 jQuery 集合中實現它變成了可能),受理(Resolve)返回的 Promise

        var effect = function() {         return $("div").fadeIn(800).delay(1200).append(" fadeOut! ").fadeOut();     };     $("button").bind( "click", function() {         $("p").append( " 已開始... ");         $.when( effect() ).done(function() {             $("p").append(" 完成! ");         });         //效果顯示好像是等動畫執行完成后才執行done()方法     });
        登錄后復制

        【推薦學習:jQuery視頻教程、web前端視頻】

        贊(1)
        分享到: 更多 (0)
        網站地圖   滬ICP備18035694號-2    滬公網安備31011702889846號
        主站蜘蛛池模板: 四虎国产精品永久地址99| 国产69精品久久久久99尤物| 久久精品国产精品青草| 亚洲日韩一页精品发布| 国产精品九九久久免费视频 | 国产精品日韩AV在线播放| 精品一区二区三区四区在线| 久久99热精品| 成人国内精品久久久久一区| 亚洲AV永久无码精品网站在线观看| 久久久精品日本一区二区三区| 成人国产一区二区三区精品| 国产一区二区三区久久精品| 国产成人精品无码播放| 久久夜色精品国产网站| 亚洲AV午夜福利精品一区二区| 日韩精品一二三区| 精品国产污污免费网站入口| 国产精品1024视频| 亚洲国产精品线在线观看| 国产精品成人va在线观看| avtt天堂网久久精品| 久久精品国产99久久久| 亚洲综合无码精品一区二区三区| 亚洲AV成人精品日韩一区18p| 久久中文精品无码中文字幕| 精品福利一区二区三区| 国产成人精品亚洲精品| 2022精品国偷自产免费观看| 久久最新精品国产| 精品久久久久久久久中文字幕| 国产精品成人在线| 97久久精品午夜一区二区| 99精品国产在热久久无毒不卡| 久久精品aⅴ无码中文字字幕重口 久久精品a亚洲国产v高清不卡 | 精品水蜜桃久久久久久久| 精品多毛少妇人妻AV免费久久| 久久久久国产日韩精品网站| 欧美日韩精品系列一区二区三区国产一区二区精品 | 男女男精品网站免费观看| 久久精品中文字幕第23页|