JavaScript-Ereignisschleife

Was ist die JavaScript-Ereignisschleife?

In JavaScript ist eine Ereignisschleife ein Mechanismus, der die Ausführung von Code, Ereignissen oder Nachrichten mithilfe nicht blockierender E/A steuert. Dies bietet eine Möglichkeit für nicht blockierende oder asynchrone Vorgänge in JavaScript.

Schlüsselkonzepte

1.Single Threaded
JavaScript ist Single-Threaded, was bedeutet, dass es jeweils eine Aufgabe ausführt. Single-Threaded, daher ist ein Thread, auf dem JavaScript ausgeführt wird, der sogenannte „Haupt-Thread“.

2.Call Stack
Es ist die Datenstruktur, in der JavaScript Funktionsaufrufe verfolgt. Ein Funktionsaufruf wird auf den Stapel geschoben. Bei seiner Rückkehr wird es entfernt. Wenn es leer ist, ist JavaScript bereit, den nächsten Vorgang zu verarbeiten. Es wird allgemein auch als „Hauptthread“ bezeichnet.

3.Heap
Hier speichert JavaScript Objekte und Variablen. Es wird für die dynamische Speicherzuweisung verwendet.

4.Ereigniswarteschlange
Eine Warteschlange mit Nachrichten oder Aufgaben, die auf ihre Ausführung warten. Wenn eine Aufgabe zur Warteschlange hinzugefügt wird, wartet sie zur Ausführung darauf, dass der Aufrufstapel leer ist.

5.Ereignisschleife
Es ist etwas, das ständig den Aufrufstapel und die Ereigniswarteschlange überwacht. Wenn der Aufrufstapel leer ist, werden Aufgaben aus der Ereigniswarteschlange in den Aufrufstapel verschoben und ausgeführt.

Prozess

• Ausführung von Code: Wenn JavaScript mit der Ausführung von Code beginnt, schiebt es die Funktionsaufrufe auf den Aufrufstapel. Darüber hinaus führt es eine Funktion nach der anderen aus.
• Asynchrone Vorgänge: Sobald ein Vorgang asynchron ist, wie ein setTimeout oder eine Netzwerkanforderung, blockiert das JavaScript die Ausführung nicht. Stattdessen leitet es diesen Vorgang an Web-APIs weiter, beispielsweise an den Timer des Browsers oder an Dienste, die HTTP-Anfragen verarbeiten.

• Rückruffunktionen: Wenn ein asynchroner Vorgang abgeschlossen ist, wird seine Rückruffunktion in die Ereigniswarteschlange verschoben.

• Überprüfung der Ereignisschleife: Die Ereignisschleife überprüft jetzt sowohl den Aufrufstapel als auch die Ereigniswarteschlange in der Reihenfolge. Wenn der Aufrufstapel leer ist, wird die erste Aufgabe aus der Ereigniswarteschlange ausgewählt und in den Aufrufstapel verschoben, um sie auszuführen.
  

console.log('Start');

setTimeout(() => {
  console.log('Timeout 1');
}, 1000);

setTimeout(() => {
  console.log('Timeout 2');
}, 500);

console.log('End');

Beachten Sie, dass Folgendes Schritt für Schritt geschieht:

• Da der Start ein synchroner Vorgang ist, wird er sofort protokolliert.
• Der erste setTimeout wird mit einer Verzögerung von 1000 ms registriert und geht dann an die Web-APIs. Sein Rückruf wird nach 1000 ms in die Ereigniswarteschlange gestellt.
• Der zweite setTimeout wird mit einer Verzögerung von 500 ms registriert und geht dann an die Web-APIs. Sein Rückruf wird nach 500 ms in die Ereigniswarteschlange gestellt.
• Ende wird sofort protokolliert, da es synchron ist.
• Innerhalb von 500 ms wird der Rückruf für das zweite setTimeout von der Ereigniswarteschlange in den Aufrufstapel verschoben und Timeout 2 protokolliert.
• Die erste Rate für setTimeout durchläuft von der Ereigniswarteschlange zum Aufrufstapel in 1000 ms und protokolliert Timeout 1.

Zusammenfassung

• Aufrufstapel: Führt Funktionen der Reihe nach aus.
• Ereigniswarteschlange: Speichert auszuführende Nachrichten oder Aufgaben.
• Ereignisschleife: Sie führt die Aufgaben aus, die von der Ereigniswarteschlange an den Aufrufstapel übergeben werden, wenn dieser leer ist.

Das obige ist der detaillierte Inhalt vonJavaScript-Ereignisschleife. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!