Synchronous اور Asynchronous JavaScript کو سمجھنا
JavaScript ایک وقت میں ایک ہی ٹاسک چلاتا ہے۔ اس کی وجہ یہ ہے کہ یہ ایک single-threaded زبان ہے۔
تیز رفتار ایپس بنانے کے لیے، آپ کو synchronous اور asynchronous کوڈ کے درمیان فرق معلوم ہونا ضروری ہے۔
Synchronous Execution
کوڈ لائن بہ لائن چلتا ہے۔ ہر ٹاسک پچھلے ٹاسک کے مکمل ہونے کا انتظار کرتا ہے۔
ایک ATM لائن کے بارے میں سوچیں۔ دوسرا شخص مشین استعمال نہیں کر سکتا جب تک کہ پہلا شخص اپنا کام مکمل نہ کر لے۔
اگر ایک ٹاسک میں زیادہ وقت لگتا ہے، تو پورا پروگرام رک جاتا ہے۔ اسے blocking کہا جاتا ہے۔
Asynchronous Execution
ٹاسکس آزادانہ طور پر چلتے ہیں۔ JavaScript ایک ٹاسک شروع کرتا ہے اور فوراً اگلے ٹاسک پر چلا جاتا ہے۔
ایک ریسٹورنٹ کے بارے میں سوچیں۔ آپ کھانا آرڈر کرتے ہیں، اور پھر انتظار کے دوران اپنے دوستوں سے باتیں کرتے ہیں۔ آپ کھانا آنے تک خاموش نہیں بیٹھتے بلکہ دوسرے کام کرتے رہتے ہیں۔
Asynchronous کوڈ آپ کی ایپلی کیشن کو ان چیزوں کے دوران فریز (freeze) ہونے سے بچاتا ہے:
- API requests
- Database queries
- File reading
- Image uploads
Asynchronous کوڈ کو ہینڈل کرنے کے تین طریقے:
Callbacks ایک فنکشن کسی مخصوص ٹاسک کے مکمل ہونے کے بعد چلتا ہے۔ یہ بالکل ایسا ہی ہے جیسے ڈیلیوری ڈرائیور آپ کا کھانا پہنچنے پر آپ کو کال کرتا ہے۔
Promises ایک Promise مستقبل کے نتیجے کی نمائندگی کرتا ہے۔ یہ 'pending' حالت میں رہتا ہے جب تک کہ یہ یا تو 'resolved' (کامیابی) نہ ہو جائے یا 'rejected' (غلطی) نہ ہو جائے۔
Async/Await یہ asynchronous کوڈ کو synchronous کوڈ کی طرح دکھاتا ہے۔ اسے پڑھنا آسان ہے۔ آپ اپنے پروگرام کے باقی حصے کو روکے بغیر کسی فنکشن کو روکنے کے لیے
awaitکا استعمال کرتے ہیں۔
یہ اندرونی طور پر کیسے کام کرتا ہے:
JavaScript ان ٹاسکس کو مینیج کرنے کے لیے ایک Event Loop کا استعمال کرتا ہے۔
- Call Stack: آپ کے موجودہ فنکشنز پر نظر رکھتا ہے۔
- Web APIs: ٹائمرز یا fetches جیسے طویل ٹاسکس کو سنبھالتا ہے۔
- Callback Queue: مکمل شدہ ٹاسکس کو رکھتا ہے۔
- Event Loop: جب اسٹیک خالی ہوتا ہے تو ٹاسکس کو کیو (queue) سے اسٹیک میں منتقل کرتا ہے۔
موازنہ:
Synchronous:
- ترتیب وار چلتا ہے
- پروگرام کو روک دیتا ہے (Blocks)
- لکھنے میں آسان ہے
- بھاری ٹاسکس کے لیے سست ہے
Asynchronous:
- آزادانہ طور پر چلتا ہے
- Non-blocking
- زیادہ پیچیدہ ہے
- ویب ایپس کے لیے موثر ہے
ان تصورات میں مہارت حاصل کرنا React، Node.js، اور جدید APIs کے استعمال کی کلید ہے۔
Source: https://www.geeksforgeeks.org/javascript/synchronous-and-asynchronous-in-javascript/ Source: https://www.browserstack.com/guide/synchronous-vs-asynchronous-in-javascript Full post: https://dev.to/annapoo/understanding-synchronous-and-asynchronous-javascript-5gea