DanLevy.net

Einführung in Promises

JavaScript Promises machen Spaß!

Hero image for Einführung in Promises

Promises – worum geht es?

Bei jeder Ausführung von Computercode gibt es zwei mögliche Ergebnisse: Erfolg oder Fehlschlag.

Wenn dieser Code asynchron ist, wird es schwieriger, sich zuverlässig auf das Ergebnis zu verlassen.

Promises bieten eine praktische Möglichkeit, damit umzugehen.

                        +--Promise---+
                        |            |
                        | <-either-> |
                        |            |
                <-------+            +-------->
                |Failure?             Success?|
                |                             |
                v                             v
                (Rejected)           (Resolved)

Randbemerkung: Obwohl Promises eigentlich auflösen oder ablehnen sollten, können sie beides verfehlen. Das führt zu hängenden Apps und kann sehr schwer zu debuggen sein.

Woher kommen Promises?

Oft müssen Sie kein Promise selbst erstellen. Native APIs wie fetch und beliebte Bibliotheken wie axios geben bereits Promises zurück.

Falls Sie dennoch ein Promise erstellen müssen, gibt es zwei Möglichkeiten:

Promises erstellen #1/2:

Der einfachste Weg, ein Promise zu erstellen, ist die Hilfsmethode: Promise.resolve().

Sie können jeden Wert mit Promise.resolve(value) in ein Promise verpacken (oder „umwandeln“).

// Ohne Promises:
function add10(num) {
  return num + 10
}


// Mit Promises:
function add10Promised(num) {
  return Promise.resolve(num + 10)
}


console.log(add10(10)) //=> 20


add10Promised(10)
  .then(x => console.log(x)) //=> 20

Promises erstellen #2/2:

Eine weitere, flexiblere Methode: der Promise-Konstruktor.

new Promise(callback) akzeptiert eine callback-Funktion mit folgendem Interface:

new Promise(function(resolve, reject) {
  // Die Argumente `resolve` und `reject` sind beides Funktionen.
  // typeof resolve === 'function'
  // typeof reject === 'function'


  // `resolve(result)` muss ausgeführt werden, wenn das Promise erfüllt ist
  // `reject(Error)` muss ausgeführt werden, wenn das Promise abgelehnt wird
})

Promises API

Die Promises API besteht tatsächlich aus nur wenigen Methoden.

2 Instanzmethoden und 4 statische/Hilfsfunktionen.

Promise-Instanzmethoden

Der Zugriff auf Werte aus einem Promise funktioniert nicht mit den üblichen Tricks (z.B. console.log(promise)).

Alle Promises geben entweder Erfolg (via .then(fn)) oder Fehlschlag (via .catch(fn)) zurück.

Promise-Hilfsmethoden

Loading comments...