[ Leksykon ] [ JavaScript ] [ Metody ] [ Promise() ]

Promise.catch()

[_] [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [K] [L] [M] [N] [O] [P] [Q] [R] [S] [T] [U] [V] [W] [X] [Y] [Z]

promiseInstance.catch(onRejected)

  

Przykłady:

function zadanieNowe() {
 return new Promise((resolve, reject) => {
 const dialog = document.createElement("dialog");
 dialog.innerHTML = `
 <form method="dialog">
 <p>Wybierz zadanie!</p>
 <select>
 <option value="zada">Zadanie A</option>
 <option value="zadb">Zadanie B</option>
 <option value="zadc">Zadanie C</option>
 <option value="zadd">Zadanie D</option>
 </select>
 <menu>
 <li><button value="cancel">Zamknij</button></li>
 <li><button type="submit" value="ok">OK</button></li>
 </menu>
 </form>
 `;
 dialog.addEventListener("close", () => {
 if (dialog.returnValue === "ok") {
 resolve(dialog.querySelector("select").value);
 } else {
 reject(new Error("Anulowane!"));
 }
 });
 document.body.appendChild(dialog);
 dialog.showModal();
 });
}
 
zadanieNowe()
 .then(result => {
 console.log(`Zadanie 1: ${result}`);
 throw new Error("Stop!");
 })
 .then(result => {
 console.log(`Zadanie 2...: ${result}`);
 })
 .catch(error => {
 console.error(`Stop...: ${error}`);
 });

  

const WYBRANY_NR = 5;

 // funkcja jest promise zwraca resolve, reject 
 function pracaA(resolve, reject) {
 // wykonaj prace co 5
 setTimeout(() => {
 const czas = Date.now();
 const reszta = czas % 10;
 console.log(czas);
 console.log(reszta);
 
 if (reszta == WYBRANY_NR) {
 resolve(reszta);
 } 
 else if (reszta < WYBRANY_NR) {
 reject(`Wybrana liczba jest za duża: ${reszta}`);
 } 
 else if (reszta > WYBRANY_NR) {
 resolve(reszta);
 } else {
 reject(`Błąd: NR: $(WYBRANY_NR), RESZTA: ${reszta}`);
 }
 
 //zadanieB();
 
 }, 5000); 
 }

 // sprawdzamy czy liczba jest parzysta
 function pracaB1(reszta) {
 const parzystaNR = reszta % 2 === 1;
 console.log(`B1: ${reszta}`);
 console.log(`B1: ${parzystaNR}`);
 return { reszta, parzystaNR };
 }

 function pracaB2(przyczyna) {
 const err = new Error(`Opis błędu, przyczyna: ${przyczyna}`, {komunikat: przyczyna} );
 console.error(err);
 throw err; // zostanie zatrzymane skok do pierwszego catch bloku
 }

 function pracaC(dane) { // { reszta, parzysta }

 console.log(`C: ${dane.reszta}`);
 console.log(`C: ${dane.parzystaNR}`);
 
 return new Promise((resolve, reject) => {
 const { reszta, parzystaNR } = dane;
 if (reszta == WYBRANY_NR - 1) {
 dane.tekst = parzystaNR ? "nieparzysta" : "parzysta";
 resolve(dane); // { reszta, parzysta, tekst }
 }
 else if (reszta > WYBRANY_NR) {
 dane.tekst = parzystaNR ? "nieparzysta" : "parzysta";
 console.log(`Dane: reszta: ${dane.reszta} nie równa liczbie ${WYBRANY_NR}, reszta jest to liczba: ${dane.tekst}`);
 reject(`Wybrana liczba jest za mała: ${reszta}, reszta: ${dane.tekst}`);
 } else {
 dane.tekst = parzystaNR ? "nieparzysta" : "parzysta";
 resolve(dane);
 }
 });
 }
 
 function zadanieB() {

 new Promise(pracaA)
 .then(pracaB1, pracaB2)
 .then(pracaC)
 .then((dane) => { // 
 console.log(`Dane: reszta: ${dane.reszta} równa liczbie ${WYBRANY_NR} jest to liczba: ${dane.tekst}`);
 return dane;
 })
 .catch((przyczyna) => {
 if (przyczyna.komunikat) {
 console.error("Opis błędu podany wcześniej!");
 } else {
 console.error(`Problem z pracaC(): ${przyczyna}`);
 }
 })
 .finally((dane) => console.log("KONIEC!"));

 }

zadanieB();

 

Przykład, możliwe jest tworzenie .then po niepowodzeniu i "Zadanie AAA" zostanie wykonane bez względu, czy "StopN!" było wykonane poprawnie czy nie, do testu wykorzystujemy instrukcję throw:

const mojaPromise = new Promise((resolve, reject) => {
 console.log("StartN"); // StartN
 resolve("StartM");
})

mojaPromise.then((value) => {
 console.log(value); // StartM
 throw new Error("StopN!");
 })
 .catch((e) => {
 console.error(e.message); // StopN!
 })
 .then(() => {
 console.log("Zadanie AAA"); // Zadanie AAA
 });

 

const dane = new Promise((resolve, reject) => {
 throw new Error('To jest błąd!');
});

dane.catch((error) => {
 console.error(error);
});
// Error: To jest błąd!

 

const promise = new Promise((resolve, reject) => {
   setTimeout(() => {
      resolve("Przykładowe dane: trasa");
   }, 500);
});

promise.then(result => {
   console.log(result)
});

promise.catch(error => {
   console.log(error)
});

 

mojaPromise()
   .then(function (result) {
     return daneBoxA(result);
   })
   .then(function (drugiResult) {
      return daneBoxB(newResult);
   })
   .then(function (trzeciResult) {
      console.log(`Współrzędne trasy: ${trzeciResult}`);
   })
   .catch(niepowodzenieAdres);

// zastosowanie funkcji strzałek () => a jest to skrót od () => { return a; })
// ilekroć operacja napotka obietnicę, zwróć ją i odłóż jej obsługę do następnej then obsługi
mojaPromise()
   .then((result) => daneBoxA(result))
   .then((drugiResult) => daneBoxB(drugiResult))
   .then((trzeciResult) => {
      console.log(`Współrzędne trasy: ${trzeciResult}`);
   })
   .catch(niepowodzenieAdres);

 

mojaPromise()
   .then((result) =>
   mojaPromiseBoxA(result)
      .then((drugiResult) => mojaPromiseBoxB(drugiResult))
      .catch((e) => {});
   )
   .then(() => mojaPromiseBoxC()) // Zauważ, że () => x to skrót od () => { return x; }.
   .catch((e) => console.error("Awaria mojaPromise: ${e.message}"));

 

function mojaPromiseA() {
   return new Promise((resolve, reject) => {
      setTimeout(() => {resolve("Zadanie A"); }, 500)
   });
}

const mojaPromiseB = new Promise((resolve, reject) => {
   setTimeout(() => {resolve("Zadanie B"); }, 400)
});

function mojaPromiseC() {
   return new Promise((resolve, reject) => {
    setTimeout(() => {resolve("Zadanie C"); }, 300)
   });
}

function mojaPromiseD() {
   return new Promise((resolve, reject) => {
      reject(new Error("reject"));
    });
}

Promise.all([
   mojaPromiseA(),
   mojaPromiseB,
   mojaPromiseC(),
   mojaPromiseD()
])
.then(resolve => {
   console.log(resolve);
})
.catch((error) => {
   console.error(error.message);
});

 

Promise.any([
 Promise.reject(new Error("jest błąd")),
]).catch((e) => {
 console.log(e instanceof AggregateError); // true
 console.log(e.message); // Wszystkie obietnice odrzucone
 console.log(e.name); // aggregateerror
 console.log(e.errors); // [ Error: "jest błąd" ]
});

 

<script>

 window.onload = () => {

 let count = 0;

 function zadanieE() {
 
 const ile = ++count;
 const konsola = document.getElementById("konsola");
 konsola.insertAdjacentHTML("beforeend", `${ile}) Start<br>`);

 const p1 = new Promise((resolve, reject) => {
 konsola.insertAdjacentHTML("beforeend", `${ile}) Zadanie Time!<br>`);
 setTimeout( () => {resolve(ile)}, Math.random() * 2500 + 800);
 });

 p1.then((daneA) => {
 konsola.insertAdjacentHTML("beforeend", `${daneA}) Zadanie OK!<br>`);
 })
 .catch((reason) => {
 console.log(`Zdanie OFF "(${reason})"`);
 });

 konsola.insertAdjacentHTML("beforeend", `${ile}) Stop<br>`);
 
 }

 const przycisk = document.getElementById("start");
 przycisk.addEventListener("click", zadanieE);

 return;

 };

</script>

<button id="start">Start</button>
<div id="konsola"></div>

 

mojaPromise()
.then(function (result) {
     return daneBoxA(result);
   })
   .then(function (drugiResult) {
      return daneBoxB(newResult);
   })
   .then(function (trzeciResult) {
      console.log(`Współrzędne trasy: ${trzeciResult}`);
      return trzeciResult;
 })
 .catch((niepowodzenieAdres) => {
    if (niepowodzenieAdres) {
       console.error("error A");
    } else {
       console.error(`error B: ${niepowodzenieAdres}`);
    }
 })
 .finally((trzeciResult) => console.log("Dodatkowe dane"));

   

Opis:
Metoda Promise.catch() instancji Promiseplanuje wywołanie funkcji w przypadku odrzucenia obietnicy. Natychmiast zwraca równoważny Promise obiekt, umożliwiając łączenie wywołań z innymi metodami obietnicy. Parametry onRejected - funkcja do asynchronicznego wykonania, gdy ta obietnica zostanie odrzucona. Jego zwracana wartość staje się wartością spełnienia obietnicy zwróconej przez catch(). Funkcja wywoływana jest z następującymi argumentami: reason - wartość, z jaką obietnica została odrzucona. Wartość zwracana nowy Promise. Ta nowa obietnica jest zawsze oczekująca po zwróceniu, niezależnie od statusu bieżącej obietnicy. Jeśli onRejected zostanie wywołana, zwrócona obietnica zostanie rozpatrzona na podstawie wartości zwracanej przez to wywołanie lub odrzucona z powodu zgłoszonego błędu z tego wywołania. Jeśli bieżąca obietnica się spełni, onRejected nie zostanie wywołana, a zwrócona obietnica spełni się do tej samej wartości. Metodę tę catch stosuje się do obsługi błędów w składaniu obietnicy. Ponieważ zwraca a Promise, można ją połączyć w taki sam sposób, jak jej siostrzana metoda then(). Jeśli obietnica zostanie odrzucona i nie ma żadnych procedur obsługi odrzucenia, które można wywołać procedurę obsługi można dołączyć za pomocą dowolnego z then(), catch() lub finally(), wówczas host ujawnia zdarzenie odrzucenia. W przeglądarce skutkuje to zdarzeniem unhandledrejection. Jeśli do odrzuconej obietnicy, której odrzucenie spowodowało już nieobsłużone zdarzenie odrzucenia, zostanie dołączona procedura obsługi, zostanie rejectionhandled uruchomione kolejne zdarzenie. catch() wewnętrznie wywołuje then() obiekt, na którym został wywołany, przekazując undefined i onRejected jako argumenty. Wartość tego wywołania jest zwracana bezpośrednio.

Linki: