𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗣𝗿𝗼𝗺𝗶𝘀𝗲𝘀 𝗔𝗻𝗱 𝗔𝘀𝘆𝗻𝗰/𝗔𝘄𝗮𝗶𝘁 𝗘𝘅𝗽𝗹𝗮𝗶𝗻𝗲𝗱 चे स्पष्टीकरण
ऑनलाइन पिझ्झा ऑर्डर करण्याबद्दल विचार करा.
तुम्ही तुमची ऑर्डर देता. तो येईपर्यंत तुम्ही दरवाजापाशी काहीही न करता उभे राहत नाही. तुम्ही व्हिडिओ पाहता, काम करता किंवा मित्रांशी गप्पा मारता. जेव्हा पिझ्झा येतो, तेव्हा तुम्ही तो खाता.
JavaScript देखील अशाच प्रकारे काम करते.
API requests, database calls आणि timers सारख्या क्रियाकलापांना वेळ लागतो. जर JavaScript ने प्रत्येक काम पूर्ण होण्याची वाट पाहिली, तर तुमचे ॲप फ्रीझ (freeze) होईल. त्याऐवजी, निकाल येईपर्यंत JavaScript इतर कोड रन करते.
Promise म्हणजे काय?
Promise म्हणजे भविष्यात मिळणाऱ्या मूल्यासाठी (value) ठेवलेले एक placeholder आहे.
जेव्हा तुम्ही रन करता:
const promise = fetch("/users");
डेटा अजून उपलब्ध नाही. Promise म्हणते: "माझ्याकडे आता निकाल नाहीये, पण तो तयार झाला की मी तुम्हाला सांगेन."
Promise च्या तीन अवस्था (states) असतात:
- Pending
- Fulfilled (यशस्वी)
- Rejected (अयशस्वी)
fetch() सारखे बहुतेक आधुनिक APIs आपोआप Promise रिटर्न करतात. तुम्हाला ते प्रत्येक वेळी मॅन्युअली तयार करण्याची गरज नाही. तुम्ही फक्त त्यांचा वापर करता.
.then() काय करते?
अनेक लोकांना वाटते की .then() डेटा मिळवते (retrieves). तसे नाहीये.
.then() एक callback function रजिस्टर करते. तुम्ही JavaScript ला सांगत असता: "जेव्हा हे Promise पूर्ण होईल, तेव्हा हे विशिष्ट function रन करा."
हे एखाद्या फूड डिलिव्हरी ॲपसारखे आहे. तुम्ही जेवण ऑर्डर करता आणि ॲप तुम्हाला सांगते: "जेवण आल्यावर मला कॉल करा." ते function सिग्नलची वाट पाहते.
Async/Await का वापरावे?
तुम्ही स्टेप-बाय-स्टेप डेटा मिळवण्यासाठी .then() कॉल्सची साखळी (chain) तयार करू शकता. हे काम करते, पण लांब साखळ्या वाचायला कठीण असतात.
Async/await मुळे तुमचा कोड सामान्य, स्टेप-बाय-स्टेप कोडसारखा दिसतो. तो अधिक स्वच्छ (clean) आणि समजायला सोपा असतो.
await JavaScript ला ब्लॉक करते का?
हा एक सामान्य इंटरव्ह्यू प्रश्न आहे. याचे उत्तर 'नाही' असे आहे.
जेव्हा JavaScript await कीवर्डला भेटते, तेव्हा ते फक्त त्या विशिष्ट async function ला थांबवते (pause करते). तुमच्या ॲप्लिकेशनचा उर्वरित भाग चालू राहतो.
उदाहरण प्रवाह (Example flow):
- फंक्शनमधील कोड रन करा.
- await ला भेट द्या आणि ते फंक्शन थांबवा.
- स्क्रिप्टचा उर्वरित भाग रन करा.
- एकदा काम पूर्ण झाले की, फंक्शन पुन्हा सुरू करा.
सारांश:
- Promise = भविष्यातील मूल्य (future value).
- fetch() = Promise रिटर्न करते.
- .then() = तयार झाल्यावर हे function रन करा.
- await = फक्त हे function थांबवा, संपूर्ण प्रोग्राम नाही.
- async/await = Promises लिहिण्याची एक स्वच्छ पद्धत.
Source: https://dev.to/aarthirs/javascript-promises-asyncawait-explained-with-a-real-life-example-43bm