Wie verkettet man mehrere asynchrone Aufrufe mithilfe von jQuery-Versprechen?

Verketten von drei asynchronen Aufrufen mit jQuery-Promises

Bei der asynchronen Programmierung ist es üblich, mehrere Aufrufe an eine API oder einen Server nacheinander durchzuführen. Um diese Aufrufe effizient abzuwickeln, ist es wünschenswert, sie miteinander zu verketten und sicherzustellen, dass jeder Aufruf abgeschlossen ist, bevor der nächste ausgeführt wird. Mit jQuery-Versprechen kann dieser Verkettungsprozess problemlos durchgeführt werden.

Stellen Sie sich das folgende Szenario vor, in dem drei HTTP-Aufrufe nacheinander durchgeführt werden müssen und Daten von einem Aufruf zum anderen weitergeleitet werden müssen:

<code class="javascript">function first() {
    ajax();
}

function second() {
    ajax();
}

function third() {
    ajax();
}

function main() {
    first().then(second).then(third);
}</code>

In diesem Beispiel besteht die Absicht darin, einen ersten Anruf zu tätigen, auf dessen Abschluss zu warten, dann einen zweiten Anruf mit dem Ergebnis des ersten Anrufs zu tätigen und schließlich einen dritten Anruf mit dem Ergebnis zu tätigen zweiter Anruf. Dieser Code funktioniert jedoch nicht wie erwartet. Um diese Aufrufe korrekt zu verketten, ist die ordnungsgemäße Verwendung von jQuery-Versprechen erforderlich.

<code class="javascript">function first() {
    var deferred = $.Deferred();
    $.ajax({
        "success": function(resp) {
            deferred.resolve(resp);
        },
    });
    return deferred.promise();
}

function second(foo) {
    $.ajax({
        "success": function(resp) {
            // do something with the resp
        },
        "error": function(resp) {
            // handle the error
        },
    });
}

first().then(function(foo) {
    second(foo);
});</code>

Dieser Code stellt eine Teillösung bereit, aber die Verkettung für drei Funktionen wird immer noch nicht erreicht. Der Schlüssel zur Verkettung mehrerer Aufrufe liegt in der Rückgabe des von $.ajax() in jeder Funktion zurückgegebenen jqXHR-Objekts. Diese Objekte sind Promise-kompatibel und können mit .then()/.done()/.fail()/.always() verkettet werden.

<code class="javascript">function first() {
    return $.ajax(...);
}

function second(data, textStatus, jqXHR) {
    return $.ajax(...);
}

function third(data, textStatus, jqXHR) {
    return $.ajax(...);
}

function main() {
    first().then(second).then(third);
}</code>

In diesem überarbeiteten Code wird das jqXHR-Objekt von zurückgegeben Jeder Aufruf von $.ajax() stellt das Versprechen der jeweiligen Funktion dar. Dadurch können die Funktionen sequentiell verkettet werden, wobei die Ausgabe einer Funktion als Eingabe an die nächste übergeben wird.

Die Argumente data, textStatus und jqXHR ergeben sich aus dem $.ajax()-Aufruf in der vorherigen Funktion . First() speist beispielsweise second() und second() speist Third() und gibt alle relevanten Daten weiter.

Um diese Verkettung in Aktion zu sehen, eine Live-Demonstration mit $.when('foo' ), um ein erfülltes Versprechen zu liefern, finden Sie unten.

Das obige ist der detaillierte Inhalt vonWie verkettet man mehrere asynchrone Aufrufe mithilfe von jQuery-Versprechen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!