Fordítószolgálat

A Promise objektum egy aszinkron művelet későbbi befejeződését (vagy meghiúsulását) és annak eredményül kapott értékét képviseli.

Egy promise életciklusa

A Promise-nak három állapota van:

1. függőben lévő
2. teljesült
3. elutasított

Amikor létrejön, egy promise függőben van. A jövőben valamikor teljesülhet vagy elutasításra kerülhet. Ha egy promise egyszer már teljesült vagy elutasításra került, soha többé nem teljesülhet újra, és nem is utasítható el, az állapota sem változhat meg.

Más szóval:

1. Amikor függőben van, egy promise:
   • átkerülhet a teljesült vagy az elutasított állapotba.
2. Amikor teljesült, egy promise:
   • nem kerülhet át semmilyen más állapotba.
   • rendelkeznie kell egy értékkel, amely nem változhat.
3. Amikor elutasított, egy promise:
   • nem kerülhet át semmilyen más állapotba.
   • rendelkeznie kell egy indokkal, amely nem változhat.

Egy promise teljesítése

Egy promise többféleképpen is teljesíthető:

// Creates a promise that is immediately resolved
Promise.resolve(value);

// Creates a promise that is immediately resolved
new Promise((resolve) => {
  resolve(value);
});

// Chaining a promise leads to a resolved promise
somePromise.then(() => {
  // ...
  return value;
});

A fenti példákban a value bármi lehet, akár egy hiba, undefined, null vagy egy másik promise is. Általában olyan értékkel akarsz teljesíteni, amely nem hiba.

Egy promise elutasítása

Egy promise többféleképpen is elutasítható:

// Creates a promise that is immediately rejected
Promise.reject(reason)

// Creates a promise that is immediately rejected
new Promise((_, reject) {
  reject(reason)
})

// Chaining a promise with an error leads to a rejected promise
somePromise.then(() => {
  // ...
  throw reason
})

A fenti példákban a reason bármi lehet, akár egy hiba, undefined vagy null is. Általában egy hibával akarsz elutasítani.

Promise-ok láncolása

Egy promise egy későbbi művelettel folytatható, amint teljesül vagy elutasításra kerül.

• A promise.then() akkor hívódik meg, amikor a promise teljesül
• A promise.catch() akkor hívódik meg, amikor a promise elutasításra kerül
• A promise.finally() akkor hívódik meg, amikor a promise akár teljesül, akár elutasításra kerül

then

Minden promise „thenable”. Ez azt jelenti, hogy elérhető egy then nevű függvény, amely akkor fut le, amikor az eredeti promise teljesül. A promise.then(onResolved) esetén az onResolved visszahívás azt az értéket kapja, amellyel az eredeti promise teljesült. Ez mindig egy új, „láncolt” promise-szal tér vissza.

Ha egy value-t adsz vissza a then-ből, az teljesíti a „láncolt” promise-t. Ha egy reason-t dobsz a then-ben, az elutasítja a „láncolt” promise-t.

const promise1 = new Promise(function (resolve, reject) {
  setTimeout(() => {
    resolve('Success!');
  }, 1000);
});

const promise2 = promise1.then(function (value) {
  console.log(value);
  // expected output: "Success!"

  return true;
});

Ez körülbelül 1000 ms után kiírja, hogy "Success!". A promise1 állapota és értéke resolved és "Success!" lesz. A promise2 állapota és értéke resolved és true lesz.

Van egy második argumentum is, amely akkor fut le, amikor az eredeti promise elutasításra kerül. A promise.then(onResolved, onRejected) esetén az onResolved visszahívás azt az értéket kapja, amellyel az eredeti promise teljesült, vagy az onRejected visszahívás azt az indokot kapja, amellyel a promise elutasításra került.

const promise1 = new Promise(function (resolve, reject) {
  setTimeout(() => {
    resolve('Success!');
  }, 1000);

  if (Math.random() < 0.5) {
    reject('Nope!');
  }
});

function log(value) {
  console.log(value);
  return true;
}

function shout(reason) {
  console.error(reason.toUpperCase());
  return false;
}

const promise2 = promise1.then(log, shout);

• Az esetek nagyjából felében ez körülbelül 1000 ms után kiírja, hogy "Success!".
  • A promise1 állapota és értéke resolved és "Success!" lesz.
  • A promise2 állapota és értéke resolved és true lesz.
• Az esetek nagyjából felében ez azonnal kiírja, hogy "NOPE!".
  • A promise1 állapota és értéke rejected és Nope! lesz.
  • A promise2 állapota és értéke resolved és false lesz.

Fontos megérteni, hogy az életciklus szabályai miatt, amikor a promise elutasításra kerül (reject), a körülbelül 1000 ms-mal később érkező resolve csendben figyelmen kívül marad, mert a belső állapot nem változhat meg, miután egyszer elutasításra került vagy teljesült. Fontos megérteni azt is, hogy ha egy promise-ból értéket adsz vissza, az teljesíti azt, ha pedig értéket dobsz, az elutasítja. Amikor a promise1 teljesül, és van egy láncolt onResolved: then(onResolved), akkor az a folytatás egy új promise, amely teljesülhet vagy elutasításra kerülhet. Amikor a promise1 elutasításra kerül, de van egy láncolt onRejected: then(, onRejected), akkor az a folytatás egy új promise, amely teljesülhet vagy elutasításra kerülhet.

catch

Néha szeretnéd elkapni a hibákat, és csak akkor folytatni, amikor az eredeti promise elutasításra kerül (reject). A promise.catch(onCatch) esetén az onCatch visszahívás azt az indokot kapja, amellyel az eredeti promise elutasításra került. Ez mindig egy új, „láncolt” promise-szal tér vissza.

Ha egy value-t adsz vissza a catch-ből, az teljesíti a „láncolt” promise-t. Ha egy reason-t dobsz a catch-ben, az elutasítja a „láncolt” promise-t.

const promise1 = new Promise(function (resolve, reject) {
  setTimeout(() => {
    resolve('Success!');
  }, 1000);

  if (Math.random() < 0.5) {
    reject('Nope!');
  }
});

function log(value) {
  console.log(value);
  return 'done';
}

function recover(reason) {
  console.error(reason.toUpperCase());
  return 42;
}

const promise2 = promise1.catch(recover).then(log);

Az esetek nagyjából felében ez körülbelül 1000 ms után kiírja, hogy "Success!". A másik felében ez azonnal kiírja a 42-t.

• Ha a promise1 teljesül, a catch kimarad, eljut a then-ig, és az kiírja az értéket.
  • A promise1 állapota és értéke resolved és "Success!" lesz.
  • A promise2 állapota és értéke resolved és "done" lesz;
• Ha a promise1 elutasításra kerül, a catch lefut, amely visszaad egy értéket, így a lánc mostantól resolved, eljut a then-ig, és az kiírja az értéket.
  • A promise1 állapota és értéke rejected és "Nope!" lesz.
  • A promise2 állapota és értéke resolved és "done" lesz;

finally

Néha szeretnél kódot futtatni, miután egy promise lezárul, függetlenül attól, hogy teljesül-e vagy elutasításra kerül. A promise.finally(onSettled) esetén az onSettled visszahívás semmit sem kap. Ez mindig egy új, „láncolt” promise-szal tér vissza.

Ha egy value-t adsz vissza a finally-ből, az átmásolja az eredeti promise állapotát és értékét, figyelmen kívül hagyva a value-t. Ha egy reason-t dobsz a finally-ben, az elutasítja a „láncolt” promise-t, felülírva az eredeti promise bármilyen állapotát, értékét vagy indokát.

Példa

Több metódus együtt:

const myPromise = new Promise(function (resolve, reject) {
  const sampleData = [2, 4, 6, 8];
  const randomNumber = Math.round(Math.random() * 5);

  if (sampleData[randomNumber]) {
    resolve(sampleData[randomNumber]);
  } else {
    reject('Sampling did not result in a sample');
  }
});

const finalPromise = myPromise
  .then(function (sampled) {
    // If the random number was 0, 1, 2, or 3, this will be
    // reached and the number 2, 4, 6, or 8 will be logged.
    console.log(`Sampled data: ${sampled}`);
    return 'yay';
  })
  .catch(function (reason) {
    // If the random number was 4 or 5, this will be reached and
    // reason will be "An error occurred". The entire chain will
    // then reject with an Error with the reason as message.
    throw new Error(reason);
  })
  .finally(function () {
    // This will always log after either the sampled data is
    // logged or the error is raised.
    console.log('Promise completed');
  });

• Azokban az esetekben, amikor a randomNumber 0-3:
  • A myPromise a 2, 4, 6, or 8 értékkel teljesül
  • A finalPromise a 'yay' értékkel teljesül
  • Két naplóbejegyzés lesz:
    • Sampled data: ...
    • Promise completed
• Azokban az esetekben, amikor a randomNumber 4-5:
  • A myPromise a 'Sampling did not result in a sample' indokkal utasításra kerül
  • A finalPromise a Error('Sampling did not result in a sample') indokkal utasításra kerül
  • Egy naplóbejegyzés lesz:
    • Promise completed
    • bizonyos környezetekben ez egy "uncaught rejected promise: Error('Sampling did not result in a sample')" naplóbejegyzést eredményez

Ahogy fentebb látható, a reject stringgel is működik, és egy promise egy Error-ral is elutasíthat.