𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗣𝗿𝗼𝗺𝗶𝘀𝗲𝘀 𝗔𝗻𝗱 𝗔𝘀𝘆𝗻𝗰/𝗔𝘄𝗮𝗶𝘁 𝗜𝗺𝗲𝗳𝗮fafanuliwa
Fikiria kuhusu kuagiza pizza mtandaoni.
Unaweka oda yako. Husimami mlangoni kwako bila kufanya kitu mpaka ifike. Unatazama video, unafanya kazi, au unazungumza na marafiki. Pizza inapofika, unakula.
JavaScript inafanya kazi kwa njia hiyo hiyo.
Operesheni kama vile maombi ya API, wito wa hifadhidata, na saa (timers) huchukua muda. Ikiwa JavaScript ingesubiri kila kazi imalizike, programu yako ingeganda. Badala yake, JavaScript huendesha kodi nyingine wakati ikisubiri matokeo.
Promise ni nini?
Promise ni sehemu ya kusubiri (placeholder) kwa ajili ya thamani utakayopata hapo baadaye.
Unapofanya:
const promise = fetch("/users");
Data bado haipo. Promise inasema: "Sina matokeo sasa hivi, lakini nitakuambia itakapokuwa tayari."
Promise ina hali tatu:
- Pending
- Fulfilled (Mafanikio)
- Rejected (Kushindwa)
API nyingi za kisasa kama fetch() hurudisha Promise kiotomatiki. Huhitaji kuzitengeneza mwenyewe kila wakati. Unazitumia tu.
.then() hufanya nini?
Watu wengi hudhani .then() huchukua data. Haifanyi hivyo.
.then() husajili callback function. Unaiambia JavaScript: "Promise hii ikimalizika, endesha function hii mahususi."
Ni kama programu ya kuagiza chakula. Unaagiza chakula, na programu inakuambia: "Nipigie chakula kinapofika." Function inasubiri ishara hiyo.
Kwa nini utumie Async/Await?
Unaweza kuunganisha (chain) wito wa .then() ili kupata data hatua kwa hatua. Hii inafanya kazi, lakini mfululizo mrefu ni vigumu kusoma.
Async/await hufanya kodi yako ionekane kama kodi ya kawaida ya hatua kwa hatua. Ni safi zaidi na rahisi kufuata.
Je, await inazuia JavaScript?
Hili ni swali la kawaida kwenye mahojiano ya kazi. Jibu ni hapana.
JavaScript inapofika kwenye neno await, inasimamisha function hiyo mahususi ya async pekee. Sehemu nyingine ya programu yako inaendelea kuendesha.
Mtiririko wa mfano:
- Endesha kodi kwenye function.
- Fika kwenye
awaitna usimamize function hiyo. - Endesha sehemu nyingine ya script.
- Kazi ikimalizika, endelea na function hiyo.
Muhtasari:
- Promise = Thamani ya baadaye.
fetch()= Hurudisha Promise..then()= Endesha function hii itakapokuwa tayari.await= Simamisha function hii, si programu nzima.async/await= Njia safi zaidi ya kuandika Promises.
Chanzo: https://dev.to/aarthirs/javascript-promises-asyncawait-explained-with-a-real-life-example-43bm