Promise w JavaScripcie: resolve, reject, then i catch

• maPromesse to zmienna przechowująca obiekt Promise.
• resolve i reject to funkcje dostarczane przez konstruktor Promise.
• Kod wewnątrz funkcji opisuje działanie promisu.
• Jeśli operacja się uda, wywołujesz resolve z komunikatem o powodzeniu (opcjonalnym).
• Jeśli operacja się nie uda, wywołujesz reject z komunikatem błędu (opcjonalnym).

Praca z promisem

Wynik promisu obsługują metody .then() i .catch():

maPromesse
 .then((message) => {
    console.log("Succès:", message);
  })
  .catch((erreur) => {
    console.log("Erreur:", erreur);
  });

• .then() wykona się, gdy promise zostanie spełniony. Komunikat o powodzeniu trafia do niej jako argument.
• .catch() wykona się, gdy promise zostanie odrzucony. Komunikat błędu trafia do niej jako argument.

Zastosowania

Promisy przydają się do operacji asynchronicznych, na przykład pobrania obrazka z serwera. Zamiast blokować kod na czas pobierania, promise pozwala robić w tym czasie co innego i obsłużyć wynik, gdy tylko będzie dostępny.

Zastąpienie callbacków

Promisy są czytelniejszą alternatywą dla zagnieżdżonych callbacków. Oto przykład przerobienia funkcji opartej na callbackach na funkcję z promisem:

function watchTutorialCallback(successCallback, errorCallback, erreur = false) {
  // ... kod funkcji ...
  if (erreur) {
    errorCallback("Message d'erreur");
  } else {
    successCallback("Message de succès");
  }
}

function watchTutorialPromise(erreur = false) {
  return new Promise((resolve, reject) => {
    // ... kod funkcji ...
    if (erreur) {
      reject("Message d'erreur");
    } else {
      resolve("Message de succès");
    }
  });
}

Użycie .then() i .catch() robi kod czytelniejszym i oszczędza ci „ callback hell ”.

Metody zaawansowane

• Promise.all(): uruchamia kilka promisów równolegle i zwraca tablicę wyników, gdy wszystkie zostaną spełnione.
• Promise.race(): uruchamia kilka promisów równolegle i zwraca wynik pierwszego promisu, który zostanie spełniony albo odrzucony.

Podsumowanie

Promisy to mocne narzędzie do obsługi operacji asynchronicznych w JavaScripcie. Pozwalają pisać czytelniejszy kod i omijają problemy zagnieżdżonych callbacków. Przejrzyj spokojnie przykłady z filmu i poćwicz, aż to kluczowe pojęcie wejdzie ci w krew.

Promisy w JavaScripcie na pierwszy rzut oka wyglądają na skomplikowane, ale w rzeczywistości są prostsze, niż się wydaje. Ten tutorial, oparty na filmie „ JavaScript Promises In 10 Minutes ” kanału Web Dev Simplified, przeprowadzi cię przez najważniejsze pojęcia i składnię promisów.

Podstawowa idea

Promise w JavaScripcie działa jak obietnica w prawdziwym życiu. Zobowiązujesz się coś zrobić, a taka obietnica ma dwa możliwe zakończenia:

• Spełniona (resolved): obietnica została dotrzymana.
• Odrzucona (rejected): obietnicy nie dało się dotrzymać.
•  

Składnia

Promise tworzy się konstruktorem Promise:

const succes = true; // zastąp własnym warunkiem

let maPromesse = new Promise((resolve, reject) => {
  // Kod, który spełnia obietnicę
  if (succes) {
    resolve("Message de succès");
  } else {
    reject("Message d'échec");
  }
});

W tym przykładzie:

• maPromesse to zmienna przechowująca obiekt Promise.
• resolve i reject to funkcje dostarczane przez konstruktor Promise.
• Kod wewnątrz funkcji opisuje działanie promisu.
• Jeśli operacja się uda, wywołujesz resolve z komunikatem o powodzeniu (opcjonalnym).
• Jeśli operacja się nie uda, wywołujesz reject z komunikatem błędu (opcjonalnym).

Praca z promisem

Wynik promisu obsługują metody .then() i .catch():

maPromesse
 .then((message) => {
    console.log("Succès:", message);
  })
  .catch((erreur) => {
    console.log("Erreur:", erreur);
  });

• .then() wykona się, gdy promise zostanie spełniony. Komunikat o powodzeniu trafia do niej jako argument.
• .catch() wykona się, gdy promise zostanie odrzucony. Komunikat błędu trafia do niej jako argument.

Zastosowania

Promisy przydają się do operacji asynchronicznych, na przykład pobrania obrazka z serwera. Zamiast blokować kod na czas pobierania, promise pozwala robić w tym czasie co innego i obsłużyć wynik, gdy tylko będzie dostępny.

Zastąpienie callbacków

Promisy są czytelniejszą alternatywą dla zagnieżdżonych callbacków. Oto przykład przerobienia funkcji opartej na callbackach na funkcję z promisem:

function watchTutorialCallback(successCallback, errorCallback, erreur = false) {
  // ... kod funkcji ...
  if (erreur) {
    errorCallback("Message d'erreur");
  } else {
    successCallback("Message de succès");
  }
}

function watchTutorialPromise(erreur = false) {
  return new Promise((resolve, reject) => {
    // ... kod funkcji ...
    if (erreur) {
      reject("Message d'erreur");
    } else {
      resolve("Message de succès");
    }
  });
}

Użycie .then() i .catch() robi kod czytelniejszym i oszczędza ci „ callback hell ”.

Metody zaawansowane

• Promise.all(): uruchamia kilka promisów równolegle i zwraca tablicę wyników, gdy wszystkie zostaną spełnione.
• Promise.race(): uruchamia kilka promisów równolegle i zwraca wynik pierwszego promisu, który zostanie spełniony albo odrzucony.

Podsumowanie

Promisy to mocne narzędzie do obsługi operacji asynchronicznych w JavaScripcie. Pozwalają pisać czytelniejszy kod i omijają problemy zagnieżdżonych callbacków. Przejrzyj spokojnie przykłady z filmu i poćwicz, aż to kluczowe pojęcie wejdzie ci w krew.