JavaScripti lubaduste õpetus: lahendamine, tagasilükkamine ja aheldamine JS-is ja ES6-s

Lubadused on üks viise, kuidas JavaScripti asünkroonsete toimingutega hakkama saada. Paljud inimesed vaevlevad arusaamades, kuidas lubadused töötavad, nii et proovin selles postituses neid võimalikult lihtsalt lahti seletada.

Lubadused on lai teema, nii et ma ei saa selle artikli üksikasjadesse minna. Kuid leiate üldise sissejuhatuse lubaduste kohta, selgitused sellistele terminitele nagu lahendamine, tagasilükkamine ja aheldamine ning koodinäide lubaduste loomiseks ja kasutamiseks.

Eeldus: selle artikli paremaks mõistmiseks vaadake minu teist postitust JavaScripti tagasihelistamise kohta.

Mis on lubadus?

JavaScripti lubadus sarnaneb reaalses elus antud lubadusega. Kui anname reaalses elus lubaduse, on see garantii, et kavatseme tulevikus midagi ette võtta. Sest lubadusi saab anda ainult tulevikuks.

Lubadusel on kaks võimalikku tulemust: seda kas täidetakse, kui aeg saabub, või ei.

See kehtib ka JavaScripti lubaduste kohta. Kui määratleme lubaduse JavaScripti abil, lahendatakse see siis, kui aeg saabub, või lükatakse see tagasi.

Lubadused JavaScriptis

Kõigepealt on lubadus objekt. Promise objektil on 3 olekut:

  • Ootel: Esialgne olek, enne kui lubadus õnnestub või ebaõnnestub
  • Lahendatud: täidetud lubadus
  • Tagasi lükatud: ebaõnnestunud lubadus

Näiteks kui me palume lubaduse abil serverilt andmeid, on see ootel režiimis, kuni me oma andmed kätte saame.

Kui saavutame teabe serverist, lahendatakse lubadus edukalt. Aga kui me ei saa teavet, siis on lubadus tagasilükatud olekus.

Lisaks, kui on mitu taotlust, siis pärast esimese lubaduse lahendamist (või tagasilükkamist) algab uus protsess, millele saame selle otse kinnitada meetodiga, mida nimetatakse aheldamiseks.

Soovi korral saate vaadata ka allpool olevat videoversiooni:

Mis vahe on tagasihelistamisel ja lubadustel?

Peamine erinevus tagasihelistamisfunktsioonide ja lubaduste vahel on see, et me kinnitame lubadusele tagasihelistamise, mitte selle edastamise. Seega kasutame koos lubadustega tagasihelistamise funktsioone, kuid teistmoodi (aheldamine).

See on lubaduste kasutamise üks suurimaid eeliseid, kuid miks?

Mis on aheldamine?

Tagasihelistamise funktsioone on JavaScripti asünkroonsete toimingute jaoks kasutatud juba aastaid. Kuid mõnel juhul võib lubaduste kasutamine olla parem valik.

Kui tuleb teha mitu asünkroonimistoimingut ja kui proovime nende jaoks kasutada vanu häid tagasihelistamisi, leiame end kiiresti olukorrast, mida nimetatakse tagasihelistamise põrguks:

firstRequest(function(response) { secondRequest(response, function(nextResponse) { thirdRequest(nextResponse, function(finalResponse) { console.log('Final response: ' + finalResponse); }, failureCallback); }, failureCallback); }, failureCallback);

Kui aga lubadustega tegeleme sama toiminguga, kuna võime tagasihelistamised kinnitada, mitte neid edastada, näib seekord sama ülaltoodud kood palju puhtam ja hõlpsamini loetav:

firstRequest() .then(function(response) { return secondRequest(response); }).then(function(nextResponse) { return thirdRequest(nextResponse); }).then(function(finalResponse) { console.log('Final response: ' + finalResponse); }).catch(failureCallback);

Ülalolev kood näitab, kuidas mitu tagasihelistamist saab üksteise järel aheldada. Ketid on üks lubaduste parimatest omadustest.

Lubaduse loomine ja kasutamine samm-sammult

Esiteks kasutame objekti Promise loomiseks konstruktorit:

const myPromise = new Promise();

Selleks on vaja kahte parameetrit, üks õnnestumiseks (lahendamiseks) ja teine ​​ebaõnnestumiseks (tagasilükkamiseks):

const myPromise = new Promise((resolve, reject) => { // condition });

Lõpuks tuleb tingimus. Kui tingimus on täidetud, siis lubadus lahendatakse, vastasel juhul lükatakse see tagasi:

const myPromise = new Promise((resolve, reject) => { let condition; if(condition is met) { resolve('Promise is resolved successfully.'); } else { reject('Promise is rejected'); } });

Nii et oleme loonud oma esimese lubaduse. Nüüd kasutame seda.

siis () lahendatud lubaduste jaoks:

Kui vaatate selle postituse alguses pilti uuesti, näete, et on kaks juhtumit: üks lahenduste lubamiseks ja teine ​​tagasilükkamiseks. Kui lubadus lahendatakse (edu juhtum), siis juhtub midagi järgmisena (sõltub sellest, mida me eduka lubadusega teeme).

myPromise.then();

Seejärel () meetodit kutsutakse pärast lubaduse lahendamist. Siis saame otsustada, mida lahendatud lubadusega peale hakata.

Näiteks logime konsooli sõnumi, mille saime lubadusest:

myPromise.then((message) => { console.log(message); });

tagasilükatud lubaduste saak ():

Kuid toonane () meetod on mõeldud ainult lahendustele Lubadused. Mis siis, kui lubadus ebaõnnestub? Seejärel peame kasutama meetodit catch ().

Samamoodi kinnitame ka meetodi then (). Me võime ka kohe pärast seda () meetodit (

myPromise.then((message) => { console.log(message); }).catch((message) => { console.log(message); });

Nii et kui lubadus tagasi lükatakse, liigub see meetod catch () ja seekord näeme konsoolil teistsugust sõnumit.

Tõmba otsad kokku

Nii loome JavaScripti lubaduse ja kasutame seda lahendatud ja tagasilükatud juhtumite jaoks. Lubadused on laiem teema ja nende kohta on veel palju asju õppida. Nii et nende töö mõistmine võtab aega.

See postitus on lihtsalt sissejuhatus lubadustesse ja loodan, et leidsite sellest abi, kui soovite aimu saada, mis on JavaScripti lubadused ja kuidas neid kasutada.

Kui soovite veebiarenduse kohta rohkem teada saada, külastage lisateavet minu Youtube'i kanalilt.

Aitäh, et lugesid!