Mikä on Promise?

Promise on tulevan arvon paikkamerkki, joka voi olla:

Promise alkaa tilassa pending ja asettuu pysyvästi joko tilaan fulfilled arvolla tai tilaan rejected syyn kanssa.

resolve-, reject- ja then()-metodien ymmärtäminen

Promisen luominen

Promisen luomiseksi annetaan funktio, jolla on kaksi parametria: resolve ja reject. Nämä parametrit ovat funktioita, joita käytetään osoittamaan, onko asynkroninen operaatio suoritettu onnistuneesti vai epäonnistunut.

const myPromise = new Promise((resolve, reject) => {
  const success = true; // Simulate whether the task is successful

  if (success) {
    resolve('Task completed successfully!');
  } else {
    reject('Task failed.');
  }
});

• resolve(value): Merkitsee Promisen täytetyksi (onnistuneeksi) ja välittää tuloksen (value);
• reject(error): Merkitsee Promisen hylätyksi (epäonnistuneeksi) ja välittää virheen.

then()-metodin käyttö ratkaistujen Promisien käsittelyyn:

Kun Promise on luotu, tulosta voidaan käsitellä then()-metodilla. Tätä metodia kutsutaan, kun Promise täyttyy (ratkaistaan).

myPromise.then(result => {
  console.log(result); // Output: Task completed successfully!
});

Tässä esimerkissä then()-metodi vastaanottaa arvon, joka välitetään resolve()-funktiolle, ja suorittaa palautekutsun tuloksella. Se suoritetaan vain, jos Promise ratkaistaan onnistuneesti.

Virheenkäsittely .catch()-metodilla

Promiset tarjoavat yksinkertaisen tavan käsitellä virheitä .catch()-metodin avulla. Jos Promise hylätään (epäonnistuu), virhe otetaan kiinni ja käsitellään .catch()-lohkon sisällä.

catch()-metodia käytetään virheiden käsittelyyn, kun Promise hylätään. Se sieppaa reject()-funktion välittämän virheen ja mahdollistaa epäonnistumistilanteiden hallinnan.

Promisejen ketjuttaminen peräkkäisiin asynkronisiin operaatioihin

Yksi Promisien tärkeimmistä eduista on mahdollisuus ketjuttaa niitä, mikä mahdollistaa useiden asynkronisten operaatioiden käsittelyn peräkkäin ilman callback-helvettiä. Jokainen then() palauttaa uuden Promisen, jolloin voit ketjuttaa useita then()-kutsuja peräkkäin, ja tulokset näytetään HTML:ssä sitä mukaa kun kukin Promise ratkeaa.

Peräkkäiset toiminnot: Jokainen then() palauttaa uuden Promisen, siirtäen tuloksen yhdestä operaatiosta seuraavaan. Tämä mahdollistaa selkeän, lineaarisen asynkronisten toimintojen sarjan, joka päivittää näytettävän tekstin HTML:ssä.

Virheenkäsittely: .catch()-metodi käsittelee kaikki virheet, jotka ilmenevät minkä tahansa Promisen ratkaisun aikana. Tämä varmistaa, että virheet havaitaan ja näytetään sivulla riippumatta siitä, missä kohtaa ketjua ne tapahtuvat.

Miksi käyttää Promiseja?

1. Callback-helvetin välttäminen: Promiset tarjoavat siistimmän ja helpommin luettavan tavan käsitellä asynkronisia operaatioita kuin syvästi sisäkkäiset callbackit;
2. Virheenkäsittely: Promiset tarjoavat sisäänrakennetun virheenkäsittelyn .catch()-metodilla, mikä helpottaa hylättyjen operaatioiden käsittelyä;
3. Peräkkäinen ketjutus: Promiset mahdollistavat useiden asynkronisten toimintojen suorittamisen peräkkäin ketjutuksen avulla, mikä tekee koodista helpommin seurattavaa ja ylläpidettävää.