## Event-Loop

Bevor wir in die Thematik von Promises eintauchen können, müssen wir verstehen, wie JavaScript im inneren Funktioniert.

Im Allgemeinen läuft alles in einer Event-Loop. Diese Loop ist eine Warteschlange die bei jedem "Durchgang" eine Funktion aus besagter Warteschlange aufruft.

Funktionen werden durch verschiedene Mechanismen in die Warteschlange der Event-Loop gesteckt. Eine solche Methode haben wir bereits kennen gelernt: Events

Klickt der Nutzer auf einen Button, der einen JavaScript-EventListener hat, so wird die Funktion beim klicken in die Event-Loop eingereiht, um nächstmöglich ausgeführt zu werden.

Die Event-Loop führt also Funktionen aus, sammelt und prozessiert Events und führt eingereihte Unter-Aufgaben aus.

Hierfür verwendet die Event-Loop - stark vereinfacht - 3 Konzepte:

- Stack mit Frames
- Queue mit Messages
- Heap mit Objekten

1. "Events" (Messages) werden in die Queue gelegt
2. "Frames" (Funktionen) liegen im Stack
3. Objekte mit denen gearbeitet wird, sind im Heap.

In JavaScript ist es nicht möglich die Abarbeitung einer Funktion anzuhalten.

Im Event Loop wird darauf gewartet, dass eine Funktion komplett abschließt / abgearbeitet wird bevor die nächste Message aus der Queue geladen wird.

Halten wir in einer Funktion die weitere Abarbeitung auf, so Sorgen wir gleichzeitig dafür dass der Browser in dieser Zeit nicht weiter arbeiten kann.

Wir empfinden dass als Lag oder simples "Nicht-Antworten" der Website auf Nutzer-Interaktionen (wenn die Abarbeitung länger als ein paar Millisekunden benötigt)

Es gibt ein paar Möglichkeiten als Entwickler Funktionen in die Queue zu legen anstatt Funktionen direkt auszuführen.

Diese Möglichkeiten sind in den Funktionen `setInterval` und `setTimeout` "versteckt".

"Versteckt" daher, weil sie eigentlich nicht direkt für diesen Gedacht sind.

### setTimeout

`setTimeout` ist eine Funktion, die als Paramter einen Callback und eine Dauer in Millisekunden erwartet.

Nach der Angegebenen Zeit in Millisekunden wird der Callback in die Queue gesteckt um dort zum nächstmöglichen Zeitpunkt ausgeführt zu werden.

          const toBeExecutedLater = () => {
            console.log('Ich komme später!');
          };

          setTimeout(toBeExecutedLater, 500);

          console.log('Ich komme vorher!');

### setInterval

`setInterval` ist sehr ähnlich zu `setTimeout`, ruft aber den angegebenen Callback in Intervallen der angegebenen Zeit in Millisekunden aus.

Beide Funktionen haben einen Rückgabewert, der eine Art ID repräsentiert.

Mithilfe dieser ID kann ein timeout bzw interval auch wieder angehalten werden, indem die ID in `clearTimeout` beziehungsweise in `clearInterval` heineingegeben wird.