Heim  >  Artikel  >  Web-Frontend  >  Warum JavaScript niemals schläft: Eine einfache Anleitung zur Ereignisschleife

Warum JavaScript niemals schläft: Eine einfache Anleitung zur Ereignisschleife

Patricia Arquette
Patricia ArquetteOriginal
2024-10-30 03:24:03604Durchsuche

JavaScript als Single-Threaded-Sprache: Erwähnen Sie kurz, wie JavaScript jeweils nur eine Aufgabe verarbeitet, die Ereignisschleife jedoch den Eindruck erweckt, dass es anders ist

. So funktioniert die Ereignisschleife: Die wichtigsten Schritte im Ereignisschleifenprozess

  • Stapel: Der Aufrufstapel verwaltet synchronen Code.

  • Warteschlange: Die Rückrufwarteschlange enthält Aufgaben, die darauf warten, ausgeführt zu werden.

  • Schleife: Die Ereignisschleife prüft vor
    , ob der Stapel leer ist Verschieben von Aufgaben aus der Warteschlange auf den Stapel.

Why JavaScript Never Sleeps: An Easy Guide to the Event Loop

Aufschlüsselung des Arbeitsablaufs:

Erste Codeausführung:

console.log('Hi');
$.get('url', function cb(data) {
  console.log(data);
});
console.log('JSConfEU');

  • Wenn die Ausführung dieses Codes beginnt, wird console.log('Hi') zum Aufrufstapel hinzugefügt und „Hi“ wird in der Konsole gedruckt.

Asynchroner Funktionsaufruf ($.get):

  • Als nächstes wird $.get('url', function cb(data) { ... }) angetroffen. Diese Funktion initiiert eine HTTP-Anfrage zum Abrufen von Daten von „URL“.

  • Anstatt den Hauptthread zu blockieren, wird die Anfrage an die Web-APIs-Umgebung (häufig Teil des Browsers) gesendet.

  • Die Rückruffunktion (cb) ist für die Ausführung registriert, sobald die HTTP-Anfrage abgeschlossen ist, sie wird jedoch nicht sofort ausgeführt. Die HTTP-Anfrage wird weiterhin im Abschnitt „Web-APIs“ geladen, der als XHR (XMLHttpRequest) gekennzeichnet ist, was typisch für die Verarbeitung von Netzwerkanfragen ist.

Weiter zur nächsten Synchronlinie:

  • JavaScript fährt mit der nächsten Zeile fort, console.log('JSConfEU'), die dem Call Stack hinzugefügt wird. „JSConfEU“ wird dann auf der Konsole ausgegeben.

Ereignisschleife und Aufgabenwarteschlange:

  • Nach Abschluss des gesamten synchronen Codes wird der Aufrufstapel leer und JavaScript wartet auf den Abschluss aller asynchronen Aufgaben.

  • Sobald die HTTP-Anfrage abgeschlossen ist, wird die Rückruffunktion (cb) von den Web-APIs in die Aufgabenwarteschlange verschoben.

  • Die Ereignisschleife prüft kontinuierlich, ob der Aufrufstapel leer ist, und wenn dies der Fall ist, verschiebt die Ereignisschleife Aufgaben aus der Aufgabenwarteschlange in den Aufrufstapel

Rückrufausführung:

  • Wenn die Ereignisschleife die Rückruffunktion auf dem Aufrufstapel platziert, führt sie console.log(data); innerhalb der Callback-Funktion werden die von der HTTP-Anfrage empfangenen Daten an die Konsole ausgegeben.

Zusammenfassung:

Dieser Ablauf zeigt, wie die Ereignisschleife asynchronen Code verarbeitet
von:

  • Synchronen Code sofort auf dem Call Stack verarbeiten.

  • Asynchrone Aufgaben in den Web-APIs verarbeiten und nach Abschluss in die Aufgabenwarteschlange verschieben.

  • Erlaubt der Ereignisschleife, Aufgaben nur dann in den Aufrufstapel zu verschieben, wenn dieser leer ist, wodurch eine nicht blockierende Codeausführung sichergestellt wird.

Das obige ist der detaillierte Inhalt vonWarum JavaScript niemals schläft: Eine einfache Anleitung zur Ereignisschleife. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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