Heim > Artikel > Web-Frontend > Was ist ein verzögertes JQuery-Objekt?
Das verzögerte jQuery-Objekt ist „Deferred“, ein verknüpfbares Dienstprogrammobjekt, das durch Aufrufen der jQuery.Deferred()-Methode erstellt wird. Ein verzögertes Objekt ist verkettbar, ähnlich wie ein jQuery-Objekt, außer dass es über eigene Methoden verfügt. Es kann mehrere Rückruffunktionen in einer Rückrufliste registrieren, die Rückrufliste aufrufen und den Erfolg oder Misserfolg einer asynchronen oder synchronen Funktion übergeben Funktionszustand.
Die Betriebsumgebung dieses Tutorials: Windows7-System, JQuery3.6.1-Version, Dell G3-Computer.
Deferred Objects wurden in jQuery 1.5 eingeführt und sind verknüpfbare Dienstobjekte, die durch Aufrufen der jQuery.Deferred()-Methode erstellt werden. Es kann mehrere Rückruffunktionen in der Rückrufliste registrieren, die Rückrufliste aufrufen und den Erfolgs- oder Fehlerstatus asynchroner oder synchroner Funktionen übergeben.
Ein verzögertes Objekt ist verkettbar, ähnlich wie ein jQuery-Objekt verkettbar ist, außer dass es über eigene Methoden verfügt. Nachdem Sie ein verzögertes Objekt erstellt haben, können Sie eine der folgenden Methoden verwenden, um eine direkte Verknüpfung mit dem erstellten oder gespeicherten Objekt herzustellen, indem Sie eine oder mehrere seiner Methoden aufrufen.
Function | Description |
---|---|
$.Deferred() | wird verwendet, um eine verkettete Dienstprogrammobjektmethode zurückzugeben, um mehrere Rückrufe zu registrieren und die Rückrufwarteschlange aufzurufen, wobei eine Synchronisierung übergeben wird Oder der Erfolgs- oder Fehlerstatus einer asynchronen Funktion. |
deferred.always() | wird verwendet, um den hinzugefügten Handler aufzurufen, wenn das verzögerte Objekt akzeptiert oder abgelehnt wird. |
deferred.done() | wird verwendet, wenn das verzögerte Objekt akzeptiert oder abgelehnt wird. Wenn akzeptiert, Der hinzugefügte Handler heißt |
deferred.fail() | und wird verwendet, wenn das verzögerte (verzögerte) Objekt abgelehnt wird. Der hinzugefügte Handler heißt |
deferred.progress() | und wird verwendet, wenn ein verzögertes Objekt abgelehnt wird Erzeugt eine Fortschrittsbenachrichtigung. Rufen Sie den Add-Handler |
deferred.isRejected()1.8- | auf, um festzustellen, ob das Deferred-Objekt abgelehnt wurde |
deferred.isResolved( )1.8- | Wird verwendet, um festzustellen, ob das verzögerte Objekt abgelehnt wurde. |
deferred.notify() | Wird verwendet, um Parameter an den laufenden Rückruf zu übergeben. |
deferred.notifyWith() | Wird verwendet laufender Rückruf |
deferred.reject() | zum Ablehnen des zurückgestellten Objekts und Übergabe von Parametern an die Fehlerrückruffunktion |
deferred.rejectWith() | zum Ablehnen des zurückgestellten Objekts und Übergabe von Parametern und Kontextobjekten an die Fehler-Callback-Funktion |
deferred.resolve() | zum Auflösen verzögerter Objekte und übergeben Sie Parameter an doneCallbacks Callback-Funktion |
deferred.resolveWith() | für das Auflösungs-Delay-Objekt und übergeben Sie Parameter und Kontextobjekt to doneCallbacks Rückruffunktion |
deferred.state() | wird verwendet, um den aktuellen Status eines verzögerten (verzögerten) Objekts zu bestimmen |
deferred.pipe() | Wird verwendet, um den Status oder Wert von zu filtern ein verzögertes Objekt, das von einer Funktion zurückgegeben wird |
deferred.then() | Wird zum Hinzufügen eines Handlers verwendet, der aufgerufen wird, wenn ein verzögertes Objekt aufgelöst oder abgelehnt wird oder noch in Bearbeitung ist. |
deferred.catch() | wird verwendet, um den hinzugefügten Handler aufzurufen, wenn das Deferred-Objekt abgelehnt wird. |
deferred.promise() | wird verwendet, um ein verzögertes (verzögertes) Promise-Objekt zurückzugeben. |
.promise() | wird verwendet, um ein Promise-Objekt zurückzugeben und alle Aktionen eines bestimmten Typs zu beobachten, die an ein gebunden sind Sammlung, ob sie zur Warteschlange hinzugefügt wurde. |
$.Deferred()
$.Deferred() ist ein Konstruktor, der eine verkettete Dienstprogrammobjektmethode zurückgibt, um mehrere Rückrufe zu registrieren und die Rückrufwarteschlange aufzurufen, wobei jede Synchronisierung oder der Erfolg oder Misserfolg übergeben wird Status einer asynchronen Funktion.
Tipps:
提示:
调用 deferred.resolve() 或 eferred.resolveWith() 转换延迟到解决状态后立即执行设置的
doneCallbacks 。
调用 deferred.reject() 或 deferred.rejectWith() 转换延迟到拒绝状态后立即执行设置的 failCallbacks 。一旦对象已经进入了解决或拒绝状态,它保持该状态。回调仍然可以添加到已解决或已拒绝的 Deferred 对象——它们会立即执行。
jQuery1.5新增该函数
参数 | 说明 |
---|---|
beforeStart | Function类型 个在构造函数返回之前调用的函数 |
jQuery.Deferred()工厂函数创建一个新的deferred对象。
deferred.always()
当Deferred(延迟)对象被受理或被拒绝时,调用通过deferred.always() 添加的处理程序。
提示:参数可以是一个函数或一个函数数组。由于 deferred.always() 返回的是一个 Deferred 对象,所以可以连接其他的延迟对象方法(这里是指可以继续调用Deferred对象的方法
),包括额外的 .always 方法。 当 Deferred 对象得到解决或被拒绝时,通过deferred.always() 添加的回调函数按它们被添加时的顺序执行,并且可以作为参数传递给如下的方法使用:resolve , reject , resolveWith 或 rejectWith。
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方法已完成。" ); })
<span style="font-size: 18px;">deferred.done()</span>
当Deferred(延迟)对象被受理时,调用通过延迟对象函数deferred.done()
$.Deferred() Der Konstruktor erstellt ein neues verzögertes (deferred) Objekt, jQuery.Deferred
kann eine optionale Funktion übergeben, die in der Konstruktion verwendet wird Die Methode kehrt vor dem Aufruf zurück und übergibt ein neues Deferred-Objekt als ersten Parameter der Funktion. Beispielsweise kann die aufgerufene Funktion deferred.then() verwenden, um eine Rückruffunktion anzuhängen.
jQuery1.5 hat diese Funktion hinzugefügt$.Deferred([beforeStart])
Parameter | |
---|---|
beforeStart |
Dies bezieht sich auf Methoden, die weiterhin Deferred-Objekte aufrufen können
) verbunden werden, einschließlich zusätzlicher .always-Methoden. Wenn ein verzögertes Objekt aufgelöst oder abgelehnt wird, werden über deferred.always() hinzugefügte Rückruffunktionen in der Reihenfolge ausgeführt, in der sie hinzugefügt wurden, und können als Argumente an die folgenden Methoden übergeben werden: Auflösung, Ablehnung, AuflösungMit oder AblehnungMit. 🎜<button>Go</button> <p>Ready...</p>
🎜deferred.done()🎜
🎜🎜🎜Wenn das verzögerte (verzögerte) Objekt akzeptiert wird, rufen Sie den durch die verzögerte Objektfunktion deferred.done()
hinzugefügten Handler auf. 🎜🎜Tipps: Diese Methode akzeptiert einen oder mehrere Parameter. deferred.done() gibt ein Deferred-Objekt zurück, das mit anderen Methoden des Deferred-Objekts verbunden werden kann (rufen Sie weiterhin die Methoden des Deferred-Objekts auf), einschließlich zusätzlicher .done()-Methoden. Wenn das Deferred-Objekt aufgelöst wird, werden die über deferred.done() hinzugefügten Rückruffunktionen in der Reihenfolge ausgeführt, in der sie hinzugefügt wurden, und können als Parameter an die folgenden Methoden übergeben werden: Auflösung, AuflösungMit. 🎜🎜Syntax🎜🎜🎜deferred.done( doneCallbacks [, doneCallbacks] )🎜🎜🎜🎜jQuery1.5 hat diese Funktion hinzugefügt🎜🎜🎜Parameterbeschreibung🎜🎜🎜🎜🎜Parameterbeschreibung🎜🎜 🎜 🎜🎜🎜doneCallbacks🎜🎜 🎜 Optionaler/Funktionstyp🎜 Eine Funktion oder ein Array von Funktionen, die aufgerufen wird, wenn das verzögerte Objekt aufgelöst wird🎜🎜🎜🎜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. });
<span style="font-size: 18px;">deferred.fail()</span>
当 Deferred (延迟)对象被拒绝时,调用通过deferred.fail()添加的处理程序。
提示:该方法接受一个或者多个参数。 deferred.fail() 返回的是一个 Deferred 对象, 可以连接其他的延迟对象方法(继续调用其他Deferred 对象的方法),包括额外的 .fail() 方法。当 Deferred 对象被拒绝时,通过deferred.fail()添加的回调函数 按它们被添加时的顺序执行,并且可以作为参数传递给如下的方法使用:deferred.resolve() 或 deferred.rejectWith()。
jQuery1.5新增该函数
参数 | 说明 |
---|---|
failCallbacks | 可选/Function类型 一个函数或者函数数组,当Deferred(延迟)对象被拒绝时被调用 |
deferred.fail() 返回的是一个 Deferred 对象
jQuery示例代码
$(function () { $.get("test.php") .done(function(){ alert("$.get 成功!"); })//解决时调用 .fail(function(){ alert("$.get 失败!"); });//被拒绝时调用 })
<span style="font-size: 18px;">deferred.progress()</span>
deferred.progress() 函数当Deferred(延迟)对象生成进度通知时,调用添加处理程序。
注意:当通过调用 notify 或 notifyWith 使延迟对象产生进度通知时,progressCallbacks 就会被调用。 由于 deferred.progress()返回的是延迟对象,所以其它延迟对象方法可以链接到该对象上(链式调用)。当延迟对象被 resolved 或 rejected 时, 进度回调函数将不再被调用,但是当Deferred (延迟)进入resolved(解决) 或 rejected(拒绝)状态后,新添加任何的progressCallbacks将立即执行,使用的参数被传递给.notify() 或 notifyWith()调用
jQuery 1.7 新增该函数
参数 | 说明 |
---|---|
progressCallbacks | 可选/Function类型 一个函数或者函数数组,当Deferred(延迟)对象生成正在执行中的进度通知时被调用。 |
deferred.progress() gibt ein Deferred-Objekt
<span style="font-size: 18px;">deferred.isRejected()</span>
<span style="font-size: 18px;">deferred.isRejected()</span>
deferred.isRejected() 函数用来确定 Deferred 对象是否已被拒绝。
从jQuery1.7开始已经过时,请使用 deferred.state() 代替。
注意:
jQuery 1.5 新增该函数,1.7过时,1.8移除
deferred.isRejected() 返回的是一个 Boolean类型
<span style="font-size: 18px;">deferred.isResolved()</span>
deferred.isResolved() 函数用来确定 Deferred 对象是否已被解决。
从jQuery1.7开始已经过时,请使用 deferred.state() 代替。
注意:
jQuery 1.5 新增该函数,1.7过时,1.8移除
deferred.isResolved() 返回的是一个 Boolean类型
<span style="font-size: 18px;">deferred.notify()</span>
deferred.notify() 函数用于定一个参数,传递给正在调用的延迟对象上的回调函数 ( progressCallbacks )。
注意:
通过来自.notify()的传递参数给正在调用的延迟对象上的回调函数,当迟延对象已经被 <br> resolved 或被 rejected 之后,再调用任何 .notify() (或者添加 progressCallbacks) 都会 <br> 被忽略
zurück Die Funktion
Hinweis:Gibt „true“ zurück, wenn sich das verzögerte Objekt im abgelehnten Zustand befindet. Dies bedeutet, dass deferred.reject() oder deferred.rejectWith() für das Objekt aufgerufen wurde und failCallbacks aufgerufen wurde (oder gerade aufgerufen wird). Verzögerte (zurückgestellte) Objekte können drei Zustände haben: ausstehend, gelöst oder abgelehnt; verwenden Sie deferred.isResolved(), um zu bestimmen, ob sich das zurückgestellte Objekt im gelösten Zustand befindet.
deferred.isRejected() | |
---|---|
deferred.isRejected() gibt einen | Booleschen Typ |
<span style="font-size: 18px;">deferred.notify()</span>
zurück >🎜🎜🎜Die Funktion deferred.notify() wird verwendet, um einen Parameter festzulegen und ihn an die Rückruffunktion (progressCallbacks) für das aufgerufene Verzögerungsobjekt zu übergeben. 🎜🎜Hinweis: 🎜🎜🎜Normalerweise kann nur der Ersteller des verzögerten Objekts (Deferred) diese Methode aufrufen. 🎜🎜Sie können verhindern, dass anderer Code den Status des verzögerten Objekts ändert oder seinen Status meldet, indem Sie deferred.promise() aufrufen, um ein eingeschränktes Promise-Objekt zurückzugeben. 🎜🎜Wenn auf deferred.notify zugegriffen wird, können alle progressCallbacks durch Zugriff auf deferred.then oder deferred.progress hinzugefügt werden. Rückrufe werden in der Reihenfolge ausgeführt, in der sie hinzugefügt wurden. 🎜🎜🎜Durch Übergabe von Argumenten von .notify() an die Rückruffunktion des aufrufenden zurückgestellten Objekts, wenn das zurückgestellte Objekt<br>aufgelöst oder abgelehnt wurde, rufen Sie dann eine beliebige .notify() auf (oder fügen Sie ProgressCallBacks hinzu). wird ignoriert <br> Ignorieren
🎜🎜 Grammatik 🎜🎜🎜Deferred.notify (ARGS) 🎜🎜🎜🎜jquery 1.7 Diese Funktion hinzugefügt 🎜🎜🎜 Parameter 🎜🎜🎜🎜🎜 Parameter. 🎜🎜 Erklärung 🎜🎜🎜🎜 🎜🎜args🎜🎜🎜Optional/Objekttyp🎜 Übergeben Sie einen optionalen Parameter an Fortschrittsrückrufe (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对象。
<span style="font-size: 18px;">deferred.notifyWith()</span>
deferred.notifyWith() 函数用于给定上下文和参数,传递给正在调用的延迟对象上进行的回调函数( progressCallbacks )。
注意:
通过 .notifyWith() 传递参数给每个回调函数,当迟延对象已经被 resolved 或被 <br> rejected 之后,再调用任何 .notifyWith() (或者添加 progressCallbacks) 都会被忽略。
jQuery 1.7 新增该函数
参数 | 说明 |
---|---|
context | Object类型 作为this对象,传递给进行中的回调(progressCallbacks) |
args | Array类型 传递一个可选的参数给进行中的回调(progressCallbacks) |
deferred.notifyWith() 返回的是一个 Deferred 对象
<span style="font-size: 18px;">deferred.reject()</span>
deferred.reject() 函数用于拒绝延迟对象,并根据给定的参数调用任何 failCallbacks 回调函数。
注意:
jQuery1.5新增该函数
参数 | 说明 |
---|---|
args | Object类型 传递一个可选的参数给失败的回调(failCallbacks) |
deferred.reject() gibt ein Deferred-Objekt
<span style="font-size: 18px;">deferred.rejectWith()</span>
<span style="font-size: 18px;">deferred.rejectWith()</span>
deferred.rejectWith() 函数用于拒绝延迟对象,并根据给定的 context 和 args 参数调用任何 failCallbacks 回调函数。
注意:
jQuery1.5新增该函数
参数 | 说明 |
---|---|
context | Object类型 传递一个对象给失败的回调(failCallbacks) |
args | Array类型 传递一个可选的参数给失败的回调(failCallbacks) |
deferred.rejectWith() 返回的是一个 Deferred 对象
<span style="font-size: 18px;">deferred.resolve()</span>
deferred.resolve() 函数用于解决Deferred(延迟)对象,并根据给定的args参数给完成回调函数doneCallbacks 。
注意:
jQuery1.5新增该函数
参数 | 说明 |
---|---|
args | Object类型 传递一个可选的参数给完成回调函数(doneCallbacks) |
deferred.resolve() 返回的是一个 Deferred 对象
<span style="font-size: 18px;">deferred.resolveWith()</span>
zurück Die Funktion
Parameter Beschreibung
Objekttyp | Übergeben Sie ein Objekt, um Rückrufe fehlzuschlagen (failCallbacks)Argumente |
Array-Typ | Übergeben Sie einen optionalen Parameter, an den übergeben wird fehlgeschlagene Rückrufe (failCallbacks)
<span style="font-size : 18px;">deferred.resolve()</span>
🎜🎜🎜Die Funktion deferred.resolve() wird verwendet, um das verzögerte (deferred) Objekt aufzulösen und es gemäß den angegebenen args-Parametern zu vervollständigen. Rückruffunktion doneCallbacks. 🎜🎜Hinweis: 🎜🎜🎜Normalerweise kann nur der Ersteller des verzögerten Objekts diese Methode aufrufen. Sie können verhindern, dass anderer Code den Status des verzögerten Objekts ändert oder seinen Status meldet, indem Sie deferred.promise() aufrufen, das ein eingeschränktes Promise-Objekt zurückgibt. 🎜🎜Wenn das verzögerte Objekt aufgelöst ist, werden alle über deferred.then oder deferred.done hinzugefügten doneCallbacks aufgerufen. Rückruffunktionen werden in der Reihenfolge ausgeführt, in der sie hinzugefügt werden. Die an deferred.resolve() übergebenen args-Parameter werden an jede Rückruffunktion übergeben. Wenn das zurückgestellte Objekt in den aufgelösten Zustand wechselt, werden alle hinzugefügten doneCallbacks sofort mit den an .resolve() übergebenen Parametern ausgeführt. 🎜🎜<span style="font-size: 18px;">deferred.resolveWith()</span>
🎜🎜 Das 🎜deferred. Die Funktion „resolveWith()“ wird verwendet, um das Deferred-Objekt (Verzögerungsobjekt) aufzulösen und die Abschluss-Callback-Funktion doneCallbacks basierend auf den angegebenen Kontext- und Args-Parametern bereitzustellen. 🎜🎜Hinweis: 🎜🎜🎜Normalerweise kann nur der Ersteller des verzögerten Objekts diese Methode aufrufen. Sie können verhindern, dass anderer Code den Status des verzögerten Objekts ändert oder seinen Status meldet, indem Sie deferred.promise() aufrufen, das ein eingeschränktes Promise-Objekt zurückgibt. 🎜🎜Wenn das verzögerte Objekt aufgelöst ist, werden alle über deferred.then oder deferred.done hinzugefügten doneCallbacks aufgerufen. Rückruffunktionen werden in der Reihenfolge ausgeführt, in der sie hinzugefügt werden. Die an deferred.resolve() übergebenen args-Parameter werden an jede Rückruffunktion übergeben. Wenn das zurückgestellte Objekt in den aufgelösten Zustand wechselt, werden alle hinzugefügten doneCallbacks sofort mit den an .resolve() übergebenen Parametern ausgeführt. 🎜🎜🎜Syntax🎜🎜🎜deferred.resolveWith( context [, args ] )🎜🎜🎜🎜jQuery1.5 hat diese Funktion hinzugefügt🎜🎜🎜Parameter. Beschreibung🎜🎜🎜🎜🎜Parameter🎜🎜Beschreibung🎜🎜 🎜 🎜🎜🎜Kontext🎜 🎜 🎜Objekttyp🎜 Übergeben Sie das Kontextobjekt an die erledigte Rückruffunktion (doneCallbacks) 🎜🎜🎜🎜args🎜🎜🎜Array-Typ🎜 Übergeben Sie einen optionalen Parameter an die erledigte Rückruffunktion (doneCallbacks)🎜🎜🎜🎜deferred.resolveWith() gibt ein Deferred-Objekt
<span style="font-size: 18px;">deferred.state()</span>
<span style="font-size: 18px;">deferred.state()</span>
deferred.state() 函数用于确定一个Deferred(延迟)对象的当前状态。
主要是用于调试,例如,在准备拒绝(reject)一个延迟对象前,判断它是否已经处于 resolved 状态。
注意:
deferred.state() 方法返回一个字符串,代表Deferred(延迟)对象的当前状态。Deferred 对象可以在三种状态之一:
jQuery1.7 新增该函数
deferred.state() 返回的是一个 String类型
<span style="font-size: 18px;">deferred.pipe()</span>
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 回调函数的返回的值
zurück Die Funktion
deferred.state() wird verwendet, um den aktuellen Status eines verzögerten Objekts zu bestimmen.
Hinweis:
pending"“ : Zurückgestellte Objekte befinden sich in einem unvollendeten Status.
rejected“: Das verzögerte Objekt befindet sich im abgelehnten Zustand, was bedeutet, dass deferred.reject() oder
deferred.rejectWith() des Objekts aufgerufen wurde und die failCallbacks aufgerufen wurden (oder im Aufruf).
jQuery1.7 hat diese Funktion hinzugefügt | |
---|---|
<span style="font-size: 18px;">deferred.pipe()</span> |
|
Hinweis: Ab jQuery 1.8 ist die Methode deferred.pipe() veraltet . Verwenden Sie stattdessen deferred.then(). |
Ab jQuery 1.8 ist die deferred.pipe()-Methode veraltet. Stattdessen sollte deferred.then() verwendet werden. Die deferred.pipe()-Methode gibt ein neues Promise-Objekt zurück, |
Diese Filter können einen neuen Wert zurückgeben, wenn die Rückruffunktion done() oder fail() des von pipe() zurückgegebenen Promise-Objekts aufgerufen wird, oder andere sichtbare Objekte (Deferred, Promise usw.) zurückgeben Code>Übergibt seinen eigenen Auflösungs-/Abweisungs-Status und den Rückgabewert , der an die Pipe-Promise-Rückruffunktion übergeben wird. |
Wenn Null als Filterfunktion verwendet wird oder keine Filterfunktion angegeben ist, wird derselbe Wert als Originalwert verwendet, wenn das Pipe-Versprechen aufgelöst oder abgelehnt wird. Syntax |
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 });
<span style="font-size: 18px;">deferred.then()</span>
deferred.then() 函数当Deferred(延迟)对象被解决/拒绝或仍在进行中时,调用添加处理程序。
注意:
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 });
<span style="font-size: 18px;">deferred.catch()</span>
当Deferred对象被拒绝(reject)时,调用通过deferred.catch()添加的处理程序。
deferred.catch( fn ) 是 deferred.then( null, fn )的一个别名
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!" ); } );
<span style="font-size: 18px;">deferred.promise()</span>
deferred.promise() 函数返回 Deferred(延迟)的 Promise 对象。
注意:
方法允许一个异步函数阻止那些干涉其内部请求的进度(progress)或状态(status)的其它代码。
Promise 对象只包含 deferred 对象的一组方法,包括:done(),then(),fail(),isResolved(), isRejected(), always(), 这些方法只能观察一个 deferred 的状态;不包括任何用于改变状态的延迟方法(resolve, reject, notify, resolveWith, rejectWith, 和 notifyWith),因此Promise 对象无法更改 deferred 对象的内在状态
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";
<span style="font-size: 18px;">.promise()</span>
.promise() 函数返回一个 Promise 对象,观察某种类型被绑定到集合的所有行动,是否已被加入到队列中。
返回的 Promise 被链接到延迟对象上,保存在元素的 .data() 中。由于 .remove() 方法会移除元素上的 data,同时也会移除元素本身。所以,使用它会防止任何元素上未被受理的(unresolved) Promise 被受理(resolving)。如果有必要在元素的 Promise 被受理(resolved)之前,从 DOM 中移除该元素的话,请使用.detach() 来代替。之后再调用 .removeData()
注意:
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前端视频】
Das obige ist der detaillierte Inhalt vonWas ist ein verzögertes JQuery-Objekt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!