Skip to main content

Synchron vs. Asynchron

  • Grossteil des Codes ist synchron
  • Synchroner Code wird Zeile für Zeile ausgeführt
  • Jede Codezeile wartet, bis die vorherige Zeile beendet ist
Problem: Langlaufende Operationen blockieren die Ausführung!
const p = document.querySelector('p');
p.textContent = 'My name is Levin!';
alert('Text was edited!');
p.style.color = 'red';
Hier blockiert der alert die Codeausführung und die Seite funktioniert nicht, bis der User mit dem Alert interagiert.
  • Asynchroner Code wird ausgeführt, nachdem ein Task, die im “Hintergrund” läuft, beendet ist
  • Asynchroner Code ist nicht-blockierend
  • Die Ausführung wartet nicht darauf, dass ein asynchroner Task seine Arbeit beendet
const p = document.querySelector('p');
setTimeout(() => {
  p.textcontent = 'My name is Levin!';
}, 5000);
p.style.color = 'red';
Der Time läuft asynchron ab, das heisst die Textfarbe wird rot obwohl der Timer eigentlich die Ausführung stoppt. Der Timer wird jedoch im Hintergrund ausgeführt, dann nach 5 Sekunden wird die Callback-Funktion darin aufgerufen.

AJAX

Promises