In diesem Tutorial lernen Sie anhand von Beispielen JavaScript-Versprechen und die Verkettung von Versprechen kennen.
In JavaScript ist ein Versprechen eine gute Möglichkeit, asynchrone Vorgänge zu verarbeiten. Es wird verwendet, um herauszufinden, ob der asynchrone Vorgang erfolgreich abgeschlossen wurde oder nicht.
Ein Versprechen kann einen von drei Zuständen haben.
- steht aus
- Erfüllt
- Abgelehnt
Ein Versprechen beginnt in einem ausstehenden Zustand. Das heißt, der Prozess ist nicht abgeschlossen. Wenn die Operation erfolgreich ist, endet der Prozess in einem erfüllten Zustand. Und wenn ein Fehler auftritt, endet der Prozess in einem abgelehnten Zustand.
Wenn Sie beispielsweise Daten mithilfe eines Versprechens vom Server anfordern, befinden sich diese in einem ausstehenden Zustand. Wenn die Daten erfolgreich ankommen, sind sie in einem erfüllten Zustand. Wenn ein Fehler auftritt, befindet er sich in einem abgelehnten Zustand.
Erstellen Sie ein Versprechen
Um ein Versprechungsobjekt zu erstellen, verwenden wir den Promise()Konstruktor.
let promise = new Promise(function(resolve, reject)( //do something ));
Der Promise()Konstruktor übernimmt eine Funktion als Argument. Die Funktion akzeptiert auch zwei Funktionen resolve()und reject().
Wenn das Versprechen erfolgreich zurückgegeben wird, wird die resolve()Funktion aufgerufen. Und wenn ein Fehler auftritt, wird die reject()Funktion aufgerufen.
Angenommen, das folgende Programm ist ein asynchrones Programm. Dann kann das Programm mit einem Versprechen bearbeitet werden.
Beispiel 1: Programm mit einem Versprechen
const count = true; let countValue = new Promise(function (resolve, reject) ( if (count) ( resolve("There is a count value."); ) else ( reject("There is no count value"); ) )); console.log(countValue);
Ausgabe
Versprechen (: "Es gibt einen Zählwert.")
Im obigen Programm wird ein PromiseObjekt erstellt, das zwei Funktionen übernimmt: resolve()und reject(). resolve()wird verwendet, wenn der Prozess erfolgreich ist, und reject()wird verwendet, wenn ein Fehler im Versprechen auftritt.
Das Versprechen wird gelöst, wenn der Wert von count wahr ist.
Arbeitsweise von JavaScript Versprechen
Verkettung von JavaScript-Versprechen
Versprechen sind nützlich, wenn Sie mehrere asynchrone Aufgaben nacheinander ausführen müssen. Dafür verwenden wir Versprechen Verkettung.
Sie können eine Operation durchführen , nachdem ein Versprechen Methoden gelöst verwendet then(), catch()und finally().
JavaScript then () -Methode
Die then()Methode wird beim Rückruf verwendet, wenn das Versprechen erfolgreich erfüllt oder gelöst wurde.
Die Syntax der then()Methode lautet:
promiseObject.then(onFulfilled, onRejected);
Beispiel 2: Verketten des Versprechens mit then ()
// returns a promise let countValue = new Promise(function (resolve, reject) ( resolve('Promise resolved'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); ), ) .then( function successValue1() ( console.log('You can call multiple functions this way.'); ), );
Ausgabe
Versprechen gelöst Auf diese Weise können Sie mehrere Funktionen aufrufen.
Im obigen Programm wird die then()Methode verwendet, um die Funktionen mit dem Versprechen zu verketten. Die then()Methode wird aufgerufen, wenn das Versprechen erfolgreich gelöst wurde.
then()Mit dem Versprechen können Sie mehrere Methoden verketten.
JavaScript-Methode catch ()
Die catch()Methode wird beim Rückruf verwendet, wenn das Versprechen abgelehnt wird oder wenn ein Fehler auftritt. Beispielsweise,
// returns a promise let countValue = new Promise(function (resolve, reject) ( reject('Promise rejected'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); ), ) // executes if there is an error .catch( function errorValue(result) ( console.log(result); ) );
Ausgabe
Versprechen abgelehnt
Im obigen Programm wird das Versprechen abgelehnt. Und die catch()Methode wird mit dem Versprechen verwendet, den Fehler zu behandeln.
Das Arbeiten mit JavaScript verspricht Verkettung
JavaScript-Versprechen versus Rückruf
Versprechen ähneln Rückruffunktionen in dem Sinne, dass beide zur Abwicklung asynchroner Aufgaben verwendet werden können.
JavaScript-Rückruffunktionen können auch zum Ausführen synchroner Aufgaben verwendet werden.
Ihre Unterschiede lassen sich in folgenden Punkten zusammenfassen:
JavaScript-Versprechen
- Die Syntax ist benutzerfreundlich und leicht zu lesen.
- Die Fehlerbehandlung ist einfacher zu verwalten.
- Beispiel:
api (). then (Funktion (Ergebnis) (return api2 ();)). then (Funktion (Ergebnis2) (return api3 ();)). then (Funktion (Ergebnis3) (// Arbeit erledigen)). catch ( function (error) (// behandle alle Fehler, die vor diesem Punkt auftreten können));
JavaScript-Rückruf
- Die Syntax ist schwer zu verstehen.
- Die Fehlerbehandlung kann schwierig zu verwalten sein.
- Beispiel:
api (Funktion (Ergebnis) (api2 (Funktion (Ergebnis2)) (api3 (Funktion (Ergebnis3) (// arbeite wenn (Fehler) (// mache etwas) sonst (// mache etwas));)); ;;
JavaScript finally () -Methode
You can also use the finally() method with promises. The finally() method gets executed when the promise is either resolved successfully or rejected. For example,
// returns a promise let countValue = new Promise(function (resolve, reject) ( // could be resolved or rejected resolve('Promise resolved'); )); // add other blocks of code countValue.finally( function greet() ( console.log('This code is executed.'); ) );
Output
This code is executed.
JavaScript Promise Methods
There are various methods available to the Promise object.
| Method | Description |
|---|---|
all(iterable) | Waits for all promises to be resolved or any one to be rejected |
allSettled(iterable) | Waits until all promises are either resolved or rejected |
any(iterable) | Returns the promise value as soon as any one of the promises is fulfilled |
race(iterable) | Wait until any of the promises is resolved or rejected |
reject(reason) | Returns a new Promise object that is rejected for the given reason |
resolve(value) | Returns a new Promise object that is resolved with the given value |
catch() | Appends the rejection handler callback |
then() | Appends the resolved handler callback |
finally() | Appends a handler to the promise |
To learn more about promises in detail, visit JavaScript Promises.
