Da sich jQuery 1.8 .then genauso verhält wie .pipe:
Verfallshinweis: Ab jQuery 1.8 ist die deferred.pipe()Methode veraltet. Das deferred.then()Verfahren, das es ersetzt, sollte stattdessen verwendet werden.
und
Ab jQuery 1.8 gibt die deferred.then()Methode ein neues Versprechen zurück, mit dem der Status und die Werte einer durch eine Funktion zurückgestellten deferred.pipe()Methode gefiltert werden können, wobei die jetzt veraltete Methode ersetzt wird.
Die folgenden Beispiele könnten für einige noch hilfreich sein.
Sie dienen verschiedenen Zwecken:
.then()ist immer dann zu verwenden, wenn Sie mit dem Ergebnis des Prozesses arbeiten möchten, dh wie in der Dokumentation angegeben, wenn das zurückgestellte Objekt aufgelöst oder abgelehnt wird. Es ist dasselbe wie mit .done()oder .fail().
Sie würden das Ergebnis irgendwie .pipe()(vor) filtern . Der Rückgabewert eines Rückrufs an .pipe()wird als Argument an die Rückrufe doneund übergeben fail. Es kann auch ein anderes zurückgestelltes Objekt zurückgeben, und die folgenden Rückrufe werden für dieses zurückgestellte Objekt registriert.
Das ist nicht der Fall mit .then()(oder .done(), .fail()), die Rückgabewerte der registrierten Rückrufe werden einfach ignoriert.
Es ist also nicht so, dass Sie entweder .then() oder verwenden .pipe() . Du könnten verwenden .pipe()als für die gleichen Zwecke , .then()aber die Umkehrung nicht gilt.
Beispiel 1
Das Ergebnis einer Operation ist ein Array von Objekten:
[{value: 2}, {value: 4}, {value: 6}]
und Sie möchten das Minimum und Maximum der Werte berechnen. Nehmen wir an, wir verwenden zweidone Rückrufe:
deferred.then(function(result) {
// result = [{value: 2}, {value: 4}, {value: 6}]
var values = [];
for(var i = 0, len = result.length; i < len; i++) {
values.push(result[i].value);
}
var min = Math.min.apply(Math, values);
/* do something with "min" */
}).then(function(result) {
// result = [{value: 2}, {value: 4}, {value: 6}]
var values = [];
for(var i = 0, len = result.length; i < len; i++) {
values.push(result[i].value);
}
var max = Math.max.apply(Math, values);
/* do something with "max" */
});
In beiden Fällen müssen Sie die Liste durchlaufen und den Wert aus jedem Objekt extrahieren.
Wäre es nicht besser, die Werte vorher irgendwie zu extrahieren, damit Sie dies nicht in beiden Rückrufen einzeln tun müssen? Ja! Und dafür können wir Folgendes verwenden .pipe():
deferred.pipe(function(result) {
// result = [{value: 2}, {value: 4}, {value: 6}]
var values = [];
for(var i = 0, len = result.length; i < len; i++) {
values.push(result[i].value);
}
return values; // [2, 4, 6]
}).then(function(result) {
// result = [2, 4, 6]
var min = Math.min.apply(Math, result);
/* do something with "min" */
}).then(function(result) {
// result = [2, 4, 6]
var max = Math.max.apply(Math, result);
/* do something with "max" */
});
Natürlich ist dies ein erfundenes Beispiel und es gibt viele verschiedene (vielleicht bessere) Möglichkeiten, um dieses Problem zu lösen, aber ich hoffe, es veranschaulicht den Punkt.
Beispiel 2
Betrachten Sie Ajax-Anrufe. Manchmal möchten Sie einen Ajax-Aufruf einleiten, nachdem ein vorheriger abgeschlossen wurde. Eine Möglichkeit besteht darin, den zweiten Anruf innerhalb eines doneRückrufs zu tätigen :
$.ajax(...).done(function() {
// executed after first Ajax
$.ajax(...).done(function() {
// executed after second call
});
});
Nehmen wir nun an, Sie möchten Ihren Code entkoppeln und diese beiden Ajax-Aufrufe in eine Funktion einfügen:
function makeCalls() {
// here we return the return value of `$.ajax().done()`, which
// is the same deferred object as returned by `$.ajax()` alone
return $.ajax(...).done(function() {
// executed after first call
$.ajax(...).done(function() {
// executed after second call
});
});
}
Sie möchten das zurückgestellte Objekt verwenden, um anderen Code, der aufruft makeCalls, das Anhängen von Rückrufen für den zweiten Ajax-Aufruf zu ermöglichen
makeCalls().done(function() {
// this is executed after the first Ajax call
});
hätte nicht den gewünschten Effekt, da der zweite Anruf innerhalb eines doneRückrufs getätigt wird und von außen nicht zugänglich ist.
Die Lösung wäre .pipe()stattdessen:
function makeCalls() {
// here we return the return value of `$.ajax().pipe()`, which is
// a new deferred/promise object and connected to the one returned
// by the callback passed to `pipe`
return $.ajax(...).pipe(function() {
// executed after first call
return $.ajax(...).done(function() {
// executed after second call
});
});
}
makeCalls().done(function() {
// this is executed after the second Ajax call
});
Mithilfe von können .pipe()Sie jetzt Rückrufe an den "inneren" Ajax-Anruf anhängen, ohne den tatsächlichen Ablauf / die Reihenfolge der Anrufe offenzulegen.
Im Allgemeinen bieten zurückgestellte Objekte eine interessante Möglichkeit, Ihren Code zu entkoppeln :)