Warum wurde die Konstruktion async/await eingeführt und wie verbessert sie die Arbeit mit asynchronem Code?

Async/await wurde eingeführt, um das Schreiben von asynchronem Code zu vereinfachen, ihn lesbarer und wartbarer zu machen im Vergleich zu traditionellen Callbacks oder Promises.

Wie es verbessert:

1. Lesbarkeit: Der Code mit async/await sieht aus wie synchroner, zeilenweiser Code, was das Verständnis erheblich erleichtert.
2. Fehlerbehandlung: Erlaubt die Verwendung von Standardkonstruktionen wie try/catch zur Fehlerbehandlung im asynchronen Code, im Gegensatz zu .catch() bei Promises.
3. Debugging: Breakpoints funktionieren wie bei synchronem Code, was den Debugging-Prozess vereinfacht.
4. Weniger "Callback-Hell": Beseitigt das Problem verschachtelter Callbacks, die zu unleserlichem Code führen.

Beispiel:

Code mit Promises:

// Beispiel mit Promises
fetch('https://api.example.com/data')
  .then(response => response.json())
  .then(data => {
    console.log(data);
  })
  .catch(error => {
    console.error('Fehler beim Abrufen der Daten:', error);
  });

Der gleiche Code mit async/await:

// Beispiel mit async/await
async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error('Fehler beim Abrufen der Daten:', error);
  }
}

fetchData();

Die Konstruktion async/await basiert auf Promises und ist syntaktischer Zucker für deren Arbeit. Eine als async markierte Funktion gibt immer ein Promise zurück. Der await-Operator kann nur innerhalb einer async-Funktion verwendet werden und "wartet" auf die Erfüllung des Promises, wobei sein aufgelöstes Ergebnis zurückgegeben oder im Fehlerfall eine Ausnahme geworfen wird.