𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗣𝗿𝗼𝗺𝗶𝘀𝗲𝘀 𝗔𝗻𝗱 𝗔𝘀𝘆𝗻𝗰/𝗔𝘄𝗮𝗶𝘁 𝗘𝘅𝗽𝗹𝗮𝗶𝗻𝗲𝗱
آن لائن پیزا آرڈر کرنے کے بارے میں سوچیں۔
آپ اپنا آرڈر دیتے ہیں۔ آپ اس کے آنے تک دروازے پر کچھ کیے بغیر کھڑے نہیں رہتے۔ آپ ویڈیوز دیکھتے ہیں، کام کرتے ہیں، یا دوستوں سے باتیں کرتے ہیں۔ جب پیزا آ جاتا ہے، تو آپ اسے کھاتے ہیں۔
JavaScript بھی اسی طرح کام کرتا ہے۔
API requests، database calls، اور timers جیسے آپریشنز میں وقت لگتا ہے۔ اگر JavaScript ہر کام کے مکمل ہونے کا انتظار کرتا، تو آپ کی ایپ فریز (freeze) ہو جاتی۔ اس کے بجائے، JavaScript نتائج کا انتظار کرتے ہوئے دوسرے کوڈز کو چلاتا رہتا ہے۔
Promise کیا ہے؟
Promise ایک ایسی جگہ (placeholder) ہے جو اس ویلیو کے لیے ہوتی ہے جو آپ کو مستقبل میں ملے گی۔
جب آپ یہ چلاتے ہیں:
const promise = fetch("/users");
ڈیٹا ابھی وہاں نہیں ہے۔ Promise کہتا ہے: "میرے پاس ابھی نتیجہ نہیں ہے، لیکن جب یہ تیار ہو جائے گا تو میں آپ کو بتا دوں گا۔"
ایک Promise کی تین حالتیں (states) ہوتی ہیں:
- Pending
- Fulfilled (کامیابی)
- Rejected (ناکامی)
fetch() جیسی زیادہ تر جدید APIs خود بخود ایک Promise واپس کرتی ہیں۔ آپ کو ہر بار انہیں دستی طور پر (manually) بنانے کی ضرورت نہیں ہے۔ آپ بس انہیں استعمال کرتے ہیں۔
.then() کیا کرتا ہے؟
بہت سے لوگ سمجھتے ہیں کہ .then() ڈیٹا حاصل کرتا ہے۔ ایسا نہیں ہے۔
.then() ایک callback function رجسٹر کرتا ہے۔ آپ JavaScript کو بتا رہے ہیں: "جب یہ Promise مکمل ہو جائے، تو یہ مخصوص فنکشن چلا دیں۔"
یہ ایک فوڈ ڈیلیوری ایپ کی طرح ہے۔ آپ کھانا آرڈر کرتے ہیں، اور ایپ آپ کو بتاتی ہے: "جب کھانا پہنچ جائے تو مجھے کال کر لینا۔" فنکشن سگنل کا انتظار کرتا ہے۔
Async/Await کیوں استعمال کریں؟
آپ ڈیٹا کو مرحلہ وار حاصل کرنے کے لیے .then() کالز کو چین (chain) کر سکتے ہیں۔ یہ کام کرتا ہے، لیکن لمبی چینز کو پڑھنا مشکل ہوتا ہے۔
Async/await آپ کے کوڈ کو عام، مرحلہ وار کوڈ کی طرح بنا دیتا ہے۔ یہ زیادہ صاف ستھرا اور سمجھنے میں آسان ہے۔
کیا await JavaScript کو روک (block) دیتا ہے؟
یہ انٹرویو کا ایک عام سوال ہے۔ اس کا جواب ہے: نہیں۔
جب JavaScript await کی ورڈ پر پہنچتا ہے، تو یہ صرف اس مخصوص async فنکشن کو روکتا ہے۔ آپ کی ایپلی کیشن کا باقی حصہ چلتا رہتا ہے۔
مثالی بہاؤ (Example flow):
- فنکشن میں کوڈ چلائیں۔
- await پر پہنچیں اور اس فنکشن کو روک دیں۔
- اسکرپٹ کے باقی حصے کو چلائیں۔
- جیسے ہی کام مکمل ہو جائے، فنکشن کو دوبارہ شروع کر دیں۔
خلاصہ:
- Promise = ایک مستقبل کی ویلیو۔
- fetch() = ایک Promise واپس کرتا ہے۔
- .then() = جب تیار ہو جائے تو یہ فنکشن چلائیں۔
- await = اس فنکشن کو روکیں، پورے پروگرام کو نہیں۔
- async/await = Promises لکھنے کا ایک صاف ستھرا طریقہ۔
ماخذ: https://dev.to/aarthirs/javascript-promises-asyncawait-explained-with-a-real-life-example-43bm