W tym samouczku za pomocą przykładów dowiesz się o obietnicach JavaScript i łączeniu obietnic.
W JavaScript obietnica jest dobrym sposobem obsługi operacji asynchronicznych . Służy do sprawdzenia, czy operacja asynchroniczna została pomyślnie zakończona, czy nie.
Obietnica może mieć jeden z trzech stanów.
- W oczekiwaniu
- Spełniony
- Odrzucony
Obietnica zaczyna się w stanie oczekującym. Oznacza to, że proces nie został zakończony. Jeśli operacja się powiedzie, proces zakończy się w stanie spełnionym. A jeśli wystąpi błąd, proces kończy się odrzuceniem.
Na przykład, gdy żądasz danych z serwera za pomocą obietnicy, będzie ona w stanie oczekiwania. Gdy dane dotrą pomyślnie, będą w stanie spełnionym. Jeśli wystąpi błąd, będzie w stanie odrzuconym.
Utwórz obietnicę
Aby utworzyć obiekt obietnicy, używamy Promise()konstruktora.
let promise = new Promise(function(resolve, reject)( //do something ));
Promise()Konstruktor przyjmuje jako argument funkcji. Funkcja przyjmuje również dwie funkcje resolve()i reject().
Jeśli obietnica powróci, resolve()funkcja jest wywoływana. A jeśli wystąpi błąd, reject()wywoływana jest funkcja.
Załóżmy, że poniższy program jest programem asynchronicznym. Następnie program można obsługiwać za pomocą obietnicy.
Przykład 1: Program z obietnicą
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);
Wynik
Obietnica (: "Istnieje wartość licznika")
W powyższym programie Promisetworzony jest obiekt, który ma dwie funkcje: resolve()i reject(). resolve()jest używany, jeśli proces się powiedzie i reject()jest używany, gdy wystąpi błąd w obietnicy.
Obietnica zostaje spełniona, jeśli wartość count jest prawdziwa.
Działanie obietnicy JavaScript
Łączenie obietnic JavaScript
Obietnice są przydatne, gdy musisz obsłużyć więcej niż jedno zadanie asynchroniczne, jedno po drugim. W tym celu używamy łańcuchów obietnic.
Można wykonać operację po obietnica zostanie rozwiązany przy użyciu metod then(), catch()i finally().
JavaScript then () metoda
then()Metoda jest stosowana z zwrotnego kiedy obietnica jest z powodzeniem spełniony lub rozwiązane.
Składnia then()metody to:
promiseObject.then(onFulfilled, onRejected);
Przykład 2: Chaining the Promise with 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.'); ), );
Wynik
Obietnica rozwiązana W ten sposób można wywołać wiele funkcji.
W powyższym programie then()metoda jest używana do łączenia funkcji z obietnicą. then()Metoda jest wywoływana, gdy obietnica zostanie rozwiązany pomyślnie.
Możesz łączyć wiele then()metod z obietnicą.
Metoda catch () JavaScript
catch()Metoda jest stosowana z zwrotnego, gdy obietnica zostaje odrzucony lub gdy wystąpi błąd. Na przykład,
// 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); ) );
Wynik
Obietnica odrzucona
W powyższym programie obietnica zostaje odrzucona. A catch()metoda jest używana z obietnicą obsługi błędu.
Działanie łańcucha obietnic JavaScript
Obietnica JavaScript a wywołanie zwrotne
Obietnice są podobne do funkcji wywołania zwrotnego w tym sensie, że obie mogą być używane do obsługi zadań asynchronicznych.
Funkcje zwrotne JavaScript mogą być również używane do wykonywania zadań synchronicznych.
Różnice między nimi można podsumować w następujących punktach:
Obietnica JavaScript
- Składnia jest przyjazna dla użytkownika i łatwa do odczytania.
- Obsługa błędów jest łatwiejsza do zarządzania.
- Przykład:
api (). then (function (result) (return api2 ();)). then (function (result2) (return api3 ();)). then (function (result3) (// do work)). catch ( function (error) (// obsłuż każdy błąd, który może wystąpić przed tym punktem));
JavaScript Callback
- Składnia jest trudna do zrozumienia.
- Obsługa błędów może być trudna do opanowania.
- Przykład:
api (function (result) (api2 (function (result2) (api3 (function (result3) (// do work if (error) (// zrób coś) else (// zrób coś)));));)) ;
JavaScript last () metoda
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.
