Emzett Digital

Asynchron: Promises und fetch

Manches dauert, etwa ein Netzwerkzugriff. JavaScript wartet dann nicht blockierend, sondern arbeitet mit Promises. Mit async/await liest sich asynchroner Code wie normaler Code. fetch(url) lädt Daten; await response.json() wandelt die Antwort in ein Objekt.

Fehler fängst du mit try/catch ab. setTimeout führt Code verzögert aus.

async function ladeWitz() {
  try {
    const antwort = await fetch("https://example.com/api/witz");
    if (!antwort.ok) throw new Error("Fehler " + antwort.status);
    const daten = await antwort.json();
    console.log(daten);
  } catch (fehler) {
    console.error("Laden fehlgeschlagen:", fehler.message);
  }
}
ladeWitz();

Merke

await nur in async-Funktionen
fetch liefert ein Promise
Fehler mit try/catch abfangen

Aufgabe

Lade mit fetch eine JSON-Datei und gib ein Feld daraus aus.

Fehler fängst du mit try/catch ab. setTimeout führt Code verzögert aus.

async function ladeWitz() {
  try {
    const antwort = await fetch("https://example.com/api/witz");
    if (!antwort.ok) throw new Error("Fehler " + antwort.status);
    const daten = await antwort.json();
    console.log(daten);
  } catch (fehler) {
    console.error("Laden fehlgeschlagen:", fehler.message);
  }
}
ladeWitz();

Merke

await nur in async-Funktionen
fetch liefert ein Promise
Fehler mit try/catch abfangen

Aufgabe

Lade mit fetch eine JSON-Datei und gib ein Feld daraus aus.