Heim > Web-Frontend > js-Tutorial > Wie ist die Ausführungsreihenfolge in JavaScript-Promises?

Wie ist die Ausführungsreihenfolge in JavaScript-Promises?

Patricia Arquette
Freigeben: 2024-10-24 11:22:02
Original
961 Leute haben es durchsucht

What Is the Order of Execution in JavaScript Promises?

Wie ist die Ausführungsreihenfolge in JavaScript-Versprechen?

JavaScript-Versprechen sind eine Möglichkeit, asynchrone Vorgänge abzuwickeln. Wenn ein Versprechen aufgelöst wird, führt es seine .then()-Handler asynchron aus, nachdem der aktuelle Ausführungsthread beendet ist. Dies bedeutet, dass jeder synchrone Code im aktuellen Thread vor den .then()-Handlern ausgeführt wird.

Beispiel

Betrachten Sie den folgenden Codeausschnitt:

<code class="javascript">Promise.resolve('A')
  .then(function(a){console.log(2, a); return 'B';})
  .then(function(a){
     Promise.resolve('C')
       .then(function(a){console.log(7, a);})
       .then(function(a){console.log(8, a);});
     console.log(3, a);
     return a;})
  .then(function(a){
     Promise.resolve('D')
       .then(function(a){console.log(9, a);})
       .then(function(a){console.log(10, a);});
     console.log(4, a);})
  .then(function(a){
     console.log(5, a);});
console.log(1);
setTimeout(function(){console.log(6)},0);</code>
Nach dem Login kopieren

Das Ergebnis Dieses Code-Snippet lautet:

<code class="text">1
2 "A"
3 "B"
7 "C"
4 "B"
8 undefined
9 "D"
5 undefined
10 undefined
6</code>
Nach dem Login kopieren

Erklärung

  1. Zeile 1: Der Code beginnt mit der Auflösung eines Versprechens mit dem Wert „A“.
  2. Zeilen 2-4: Der .then()-Handler für dieses Versprechen protokolliert den Wert „A“ in der Konsole und gibt den Wert „B“ zurück.
  3. Zeilen 5–9: Der .then()-Handler für das vom vorherigen Handler zurückgegebene Versprechen protokolliert den Wert „B“ in der Konsole und gibt denselben Wert zurück.
  4. Zeilen 10–14 : Der .then()-Handler für das vom vorherigen Handler zurückgegebene Versprechen protokolliert den Wert „B“ in der Konsole und gibt denselben Wert zurück.
  5. Zeilen 15–19: Der .then()-Handler für das vom vorherigen Handler zurückgegebene Versprechen protokolliert den Wert „B“ in der Konsole und gibt denselben Wert zurück.
  6. Zeile 20: Der .then()-Handler Auf dem vom vorherigen Handler zurückgegebenen Versprechen wird der Wert „B“ in der Konsole protokolliert.
  7. Zeile 21: Eine setTimeout()-Funktion wird verwendet, um die Ausführung einer Funktion nach einer Verzögerung zu planen von 0 Millisekunden.
  8. Zeile 22: Eine console.log()-Funktion wird verwendet, um den Wert „1“ in der Konsole zu protokollieren.

Reihenfolge von Ausführung

Die Reihenfolge der Ausführung in diesem Codeausschnitt ist:

  1. Zuerst wird console.log() in Zeile 22 ausgeführt, gefolgt von Promise.resolve() in Zeile 1 .
  2. Als nächstes wird der .then()-Handler in Zeile 2 ausgeführt, gefolgt vom .then()-Handler in Zeile 5.
  3. Als nächstes wird der .then()-Handler in Zeile 10 ausgeführt , gefolgt vom .then()-Handler in Zeile 15.
  4. Als nächstes wird der .then()-Handler in Zeile 20 ausgeführt.
  5. Die setTimeout()-Funktion in Zeile 21 wird zuletzt ausgeführt.

Das obige ist der detaillierte Inhalt vonWie ist die Ausführungsreihenfolge in JavaScript-Promises?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage