← StartseiteProgrammierung (Програмування)

Was ist ein Promise in JavaScript und wie versteht man das Wesentliche schnell?

Was ist ein Promise in JavaScript und wie versteht man schnell das Wesentliche? Wir analysieren ein paar Beispiele von Promises, die helfen, ihren Zweck schnell zu verstehen.

18. Feb '25, 11:01 Uhr·2 Min. Lesezeit

InhaltsverzeichnisKlicke auf den Link, um zur gewünschten Stelle zu navigieren

Ein einfaches Beispiel für ein Promise Wie schnell verstehen?

Dieser Inhalt wurde automatisch aus dem Ukrainischen übersetzt.

Original ansehen

Stellen Sie sich vor, Sie haben einen Kaffee im Café bestellt. Der Barista nimmt die Bestellung entgegen, gibt die Quittung aus und sagt: „Warten Sie bitte einen Moment“. Sie stehen nicht still, sondern können an einen Tisch gehen, Ihr Telefon überprüfen oder auf Nachrichten antworten. Wenn der Kaffee fertig ist, ruft der Barista Sie – und Sie erhalten das Ergebnis.

Promise in JavaScript funktioniert genauso:

Sie senden eine Anfrage (zum Beispiel an den Server) und erhalten ein Versprechen (Promise), dass die Antwort später kommt.
JavaScript stoppt die Ausführung des Codes nicht – es führt weiterhin andere Aufgaben aus.
Wenn das Ergebnis bereit ist, informiert das Promise darüber, und Sie können es verarbeiten.

Ein einfaches Beispiel für ein Promise

function makeCoffee() {
  return new Promise((resolve) => {
    console.log("Bestellung angenommen...");
    setTimeout(() => {
      resolve("☕ Fertig! Hier ist Ihr Kaffee.");
    }, 2000);
  });
}

console.log("Ich blättere gerade durch mein Telefon...");
makeCoffee().then((message) => console.log(message));

Zuerst wird console.log("Ich blättere gerade durch mein Telefon...") ausgeführt, da das Promise den Code nicht blockiert.

Dann erscheint nach 2 Sekunden "☕ Fertig! Hier ist Ihr Kaffee.", wenn das Promise abgeschlossen ist.

Wenn etwas schiefgeht (zum Beispiel, wenn der Kaffee ausgeht), können wir .catch() hinzufügen:

function makeCoffee() {
  return new Promise((resolve, reject) => {
    const coffeeReady = Math.random() > 0.5; // zufälliger Erfolg oder Misserfolg

    console.log("Bestellung angenommen...");
    setTimeout(() => {
      if (coffeeReady) {
        resolve("☕ Fertig! Hier ist Ihr Kaffee.");
      } else {
        reject("❌ Entschuldigung, der Kaffee ist ausgegangen.");
      }
    }, 2000);
  });
}

makeCoffee()
  .then((message) => console.log(message))
  .catch((error) => console.log(error));

Es ist wie im echten Leben: Wenn kein Kaffee mehr da ist, entschuldigt sich der Barista, und Sie erhalten eine Fehlermeldung.

Wie schnell verstehen?

Versuchen Sie, selbst Promises zu schreiben: Erstellen Sie eine Funktion, die 3 Sekunden wartet, bevor sie antwortet, oder die zufällig mit einem Fehler endet. So können Sie schnell verstehen, wie asynchroner Code funktioniert.

Aber bevor Sie mit Promises experimentieren, sollten Sie die Struktur (resolve, reject, catch usw.) verstehen. Dazu gibt es einen separaten Beitrag.

Programmierung (Програмування)