# جاوا اسکرپٹ کی بنیادی باتیں: میتھڈز اور فنکشنز ![جاوا اسکرپٹ کی بنیادی باتیں - فنکشنز](../../../../translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.ur.png) > اسکیچ نوٹ از [Tomomi Imura](https://twitter.com/girlie_mac) ## لیکچر سے پہلے کا کوئز [لیکچر سے پہلے کا کوئز](https://ff-quizzes.netlify.app/web/quiz/9) جب ہم کوڈ لکھنے کے بارے میں سوچتے ہیں، تو ہم ہمیشہ یہ یقینی بنانا چاہتے ہیں کہ ہمارا کوڈ پڑھنے کے قابل ہو۔ اگرچہ یہ عجیب لگ سکتا ہے، لیکن کوڈ کو لکھنے کے مقابلے میں زیادہ بار پڑھا جاتا ہے۔ ایک اہم ٹول جو ڈویلپرز کے پاس قابلِ دیکھ بھال کوڈ لکھنے کے لیے ہوتا ہے وہ ہے **فنکشن**۔ [![میتھڈز اور فنکشنز](https://img.youtube.com/vi/XgKsD6Zwvlc/0.jpg)](https://youtube.com/watch?v=XgKsD6Zwvlc "میتھڈز اور فنکشنز") > 🎥 اوپر دی گئی تصویر پر کلک کریں میتھڈز اور فنکشنز کے بارے میں ویڈیو دیکھنے کے لیے۔ > آپ یہ سبق [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-functions/?WT.mc_id=academic-77807-sagibbon) پر بھی لے سکتے ہیں! ## فنکشنز فنکشن بنیادی طور پر کوڈ کا ایک بلاک ہے جسے ہم ضرورت پڑنے پر چلا سکتے ہیں۔ یہ ان حالات کے لیے بہترین ہے جہاں ہمیں ایک ہی کام بار بار انجام دینا ہو؛ بجائے اس کے کہ ہم منطق کو مختلف جگہوں پر نقل کریں (جس سے اپ ڈیٹ کرنا مشکل ہو جائے گا)، ہم اسے ایک جگہ پر مرکوز کر سکتے ہیں اور جب بھی ضرورت ہو اسے کال کر سکتے ہیں - یہاں تک کہ آپ ایک فنکشن کو دوسرے فنکشنز سے بھی کال کر سکتے ہیں! فنکشن کو نام دینا بھی اتنا ہی اہم ہے۔ اگرچہ یہ معمولی لگ سکتا ہے، لیکن نام کوڈ کے ایک حصے کو دستاویزی شکل دینے کا ایک تیز طریقہ فراہم کرتا ہے۔ آپ اسے ایک بٹن پر لیبل کی طرح سمجھ سکتے ہیں۔ اگر میں ایک بٹن پر کلک کرتا ہوں جس پر لکھا ہے "ٹائمر منسوخ کریں"، تو مجھے معلوم ہے کہ یہ گھڑی کو روک دے گا۔ ## فنکشن بنانا اور کال کرنا فنکشن کے لیے نحو (syntax) کچھ اس طرح نظر آتا ہے: ```javascript function nameOfFunction() { // function definition // function definition/body } ``` اگر میں ایک فنکشن بنانا چاہوں جو ایک سلامتی کا پیغام دکھائے، تو یہ کچھ اس طرح نظر آئے گا: ```javascript function displayGreeting() { console.log('Hello, world!'); } ``` جب بھی ہم اپنے فنکشن کو کال (یا انووک) کرنا چاہتے ہیں، ہم فنکشن کے نام کے بعد `()` استعمال کرتے ہیں۔ یہ بات قابل ذکر ہے کہ ہمارا فنکشن پہلے یا بعد میں بھی ڈیفائن کیا جا سکتا ہے؛ جاوا اسکرپٹ کمپائلر اسے آپ کے لیے تلاش کر لے گا۔ ```javascript // calling our function displayGreeting(); ``` > **NOTE:** ایک خاص قسم کا فنکشن جسے **میتھڈ** کہا جاتا ہے، آپ پہلے ہی استعمال کر رہے ہیں! درحقیقت، ہم نے اسے اپنے ڈیمو میں دیکھا جب ہم نے `console.log` استعمال کیا۔ میتھڈ اور فنکشن میں فرق یہ ہے کہ میتھڈ کسی آبجیکٹ سے منسلک ہوتا ہے (ہمارے مثال میں `console`)، جبکہ فنکشن آزاد ہوتا ہے۔ آپ اکثر ڈویلپرز کو ان اصطلاحات کو ایک دوسرے کے بدلے استعمال کرتے ہوئے سنیں گے۔ ### فنکشنز کے بہترین طریقے فنکشنز بناتے وقت ذہن میں رکھنے کے لیے کچھ بہترین طریقے ہیں: - ہمیشہ کی طرح، وضاحتی نام استعمال کریں تاکہ آپ کو معلوم ہو کہ فنکشن کیا کرے گا - الفاظ کو جوڑنے کے لیے **camelCasing** استعمال کریں - اپنے فنکشنز کو ایک خاص کام پر مرکوز رکھیں ## فنکشن کو معلومات دینا فنکشن کو زیادہ قابل استعمال بنانے کے لیے آپ اکثر اس میں معلومات دینا چاہیں گے۔ اگر ہم اپنے اوپر دیے گئے `displayGreeting` کی مثال پر غور کریں، تو یہ صرف **Hello, world!** دکھائے گا۔ یہ سب سے زیادہ مفید فنکشن نہیں ہے جو کوئی بنا سکتا ہے۔ اگر ہم اسے تھوڑا زیادہ لچکدار بنانا چاہتے ہیں، جیسے کسی کو سلام کرنے والے شخص کا نام بتانے کی اجازت دینا، تو ہم ایک **پیرامیٹر** شامل کر سکتے ہیں۔ پیرامیٹر (جسے بعض اوقات **آرگومنٹ** بھی کہا جاتا ہے) وہ اضافی معلومات ہیں جو فنکشن کو بھیجی جاتی ہیں۔ پیرامیٹرز کو تعریف کے حصے میں قوسین کے اندر درج کیا جاتا ہے اور یہ کاما سے الگ ہوتے ہیں، جیسے: ```javascript function name(param, param2, param3) { } ``` ہم اپنے `displayGreeting` کو اپ ڈیٹ کر سکتے ہیں تاکہ یہ ایک نام قبول کرے اور اسے دکھائے۔ ```javascript function displayGreeting(name) { const message = `Hello, ${name}!`; console.log(message); } ``` جب ہم اپنے فنکشن کو کال کرتے ہیں اور پیرامیٹر پاس کرتے ہیں، تو ہم اسے قوسین میں بتاتے ہیں۔ ```javascript displayGreeting('Christopher'); // displays "Hello, Christopher!" when run ``` ## ڈیفالٹ ویلیوز ہم اپنے فنکشن کو مزید لچکدار بنا سکتے ہیں مزید پیرامیٹرز شامل کر کے۔ لیکن اگر ہم ہر ویلیو کو لازمی قرار نہ دینا چاہیں تو کیا ہوگا؟ اپنے سلامتی کی مثال کے ساتھ، ہم نام کو لازمی چھوڑ سکتے ہیں (ہمیں یہ جاننے کی ضرورت ہے کہ ہم کس کو سلام کر رہے ہیں)، لیکن ہم چاہتے ہیں کہ سلامتی کو حسب ضرورت بنایا جا سکے۔ اگر کوئی اسے حسب ضرورت نہیں بنانا چاہتا، تو ہم ایک ڈیفالٹ ویلیو فراہم کرتے ہیں۔ پیرامیٹر کو ڈیفالٹ ویلیو دینے کے لیے، ہم اسے ویری ایبل کی طرح سیٹ کرتے ہیں - `parameterName = 'defaultValue'`۔ مکمل مثال دیکھنے کے لیے: ```javascript function displayGreeting(name, salutation='Hello') { console.log(`${salutation}, ${name}`); } ``` جب ہم فنکشن کو کال کرتے ہیں، تو ہم فیصلہ کر سکتے ہیں کہ `salutation` کے لیے ویلیو سیٹ کرنی ہے یا نہیں۔ ```javascript displayGreeting('Christopher'); // displays "Hello, Christopher" displayGreeting('Christopher', 'Hi'); // displays "Hi, Christopher" ``` ## ریٹرن ویلیوز اب تک جو فنکشن ہم نے بنایا ہے وہ ہمیشہ [console](https://developer.mozilla.org/docs/Web/API/console) پر آؤٹ پٹ کرے گا۔ بعض اوقات یہ وہی ہوتا ہے جو ہم چاہتے ہیں، خاص طور پر جب ہم ایسے فنکشنز بناتے ہیں جو دیگر سروسز کو کال کریں گے۔ لیکن اگر میں ایک ہیلپر فنکشن بنانا چاہوں جو کوئی حساب کتاب کرے اور ویلیو واپس کرے تاکہ میں اسے کہیں اور استعمال کر سکوں؟ ہم یہ ایک **ریٹرن ویلیو** استعمال کر کے کر سکتے ہیں۔ ریٹرن ویلیو فنکشن کے ذریعے واپس کی جاتی ہے، اور اسے ویری ایبل میں محفوظ کیا جا سکتا ہے بالکل اسی طرح جیسے ہم کسی سٹرنگ یا نمبر جیسی ویلیو کو محفوظ کر سکتے ہیں۔ اگر کوئی فنکشن کچھ واپس کرتا ہے تو `return` کلیدی لفظ استعمال کیا جاتا ہے۔ `return` کلیدی لفظ اس چیز کی ویلیو یا حوالہ کی توقع کرتا ہے جو واپس کی جا رہی ہو، جیسے: ```javascript return myVariable; ``` ہم ایک فنکشن بنا سکتے ہیں جو ایک سلامتی کا پیغام بنائے اور ویلیو کو کال کرنے والے کو واپس کرے۔ ```javascript function createGreetingMessage(name) { const message = `Hello, ${name}`; return message; } ``` جب ہم اس فنکشن کو کال کریں گے، تو ہم ویلیو کو ایک ویری ایبل میں محفوظ کریں گے۔ یہ بالکل اسی طرح ہے جیسے ہم کسی جامد ویلیو کو ویری ایبل میں سیٹ کرتے ہیں (جیسے `const name = 'Christopher'`)۔ ```javascript const greetingMessage = createGreetingMessage('Christopher'); ``` ## فنکشنز کو فنکشنز کے پیرامیٹرز کے طور پر استعمال کرنا جیسے جیسے آپ اپنی پروگرامنگ کیریئر میں آگے بڑھیں گے، آپ ایسے فنکشنز دیکھیں گے جو فنکشنز کو پیرامیٹرز کے طور پر قبول کرتے ہیں۔ یہ زبردست چال عام طور پر اس وقت استعمال کی جاتی ہے جب ہمیں یہ معلوم نہ ہو کہ کچھ کب ہوگا یا مکمل ہوگا، لیکن ہمیں معلوم ہو کہ ہمیں اس کے جواب میں کوئی آپریشن انجام دینا ہے۔ مثال کے طور پر، [setTimeout](https://developer.mozilla.org/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout) پر غور کریں، جو ایک ٹائمر شروع کرتا ہے اور مکمل ہونے پر کوڈ کو چلاتا ہے۔ ہمیں اسے بتانا ہوگا کہ ہم کون سا کوڈ چلانا چاہتے ہیں۔ یہ کام فنکشن کے لیے بہترین ہے! اگر آپ نیچے دیا گیا کوڈ چلائیں، تو 3 سیکنڈ کے بعد آپ کو پیغام **3 سیکنڈ گزر گئے ہیں** نظر آئے گا۔ ```javascript function displayDone() { console.log('3 seconds has elapsed'); } // timer value is in milliseconds setTimeout(displayDone, 3000); ``` ### گمنام فنکشنز آئیے ہم نے جو بنایا ہے اس پر دوبارہ نظر ڈالیں۔ ہم ایک فنکشن بنا رہے ہیں جس کا نام ہوگا اور جو صرف ایک بار استعمال ہوگا۔ جیسے جیسے ہماری ایپلیکیشن زیادہ پیچیدہ ہوتی جائے گی، ہم دیکھ سکتے ہیں کہ ہم بہت سے ایسے فنکشنز بنا رہے ہیں جو صرف ایک بار کال کیے جائیں گے۔ یہ مثالی نہیں ہے۔ جیسا کہ یہ پتہ چلتا ہے، ہمیں ہمیشہ نام فراہم کرنے کی ضرورت نہیں ہوتی! جب ہم ایک فنکشن کو پیرامیٹر کے طور پر پاس کر رہے ہوتے ہیں، تو ہم اسے پہلے سے بنانے کو چھوڑ سکتے ہیں اور اس کے بجائے اسے پیرامیٹر کے حصے کے طور پر بنا سکتے ہیں۔ ہم وہی `function` کلیدی لفظ استعمال کرتے ہیں، لیکن اس کے بجائے اسے پیرامیٹر کے طور پر بناتے ہیں۔ آئیے اوپر دیے گئے کوڈ کو دوبارہ لکھیں تاکہ گمنام فنکشن استعمال کیا جا سکے: ```javascript setTimeout(function() { console.log('3 seconds has elapsed'); }, 3000); ``` اگر آپ ہمارا نیا کوڈ چلائیں گے، تو آپ دیکھیں گے کہ ہمیں وہی نتائج ملتے ہیں۔ ہم نے ایک فنکشن بنایا، لیکن اسے نام دینے کی ضرورت نہیں پڑی! ### فیٹ ایرو فنکشنز بہت سی پروگرامنگ زبانوں (بشمول جاوا اسکرپٹ) میں ایک عام شارٹ کٹ **ایرو** یا **فیٹ ایرو** فنکشن کہلاتا ہے۔ یہ `=>` کا ایک خاص اشارہ استعمال کرتا ہے، جو ایک تیر کی طرح لگتا ہے - اسی لیے اس کا نام یہ ہے! `=>` استعمال کر کے، ہم `function` کلیدی لفظ کو چھوڑ سکتے ہیں۔ آئیے اپنے کوڈ کو ایک بار پھر فیٹ ایرو فنکشن استعمال کرنے کے لیے دوبارہ لکھیں: ```javascript setTimeout(() => { console.log('3 seconds has elapsed'); }, 3000); ``` ### ہر حکمت عملی کو کب استعمال کریں آپ نے اب دیکھا کہ ہمارے پاس ایک فنکشن کو پیرامیٹر کے طور پر پاس کرنے کے تین طریقے ہیں اور آپ سوچ رہے ہوں گے کہ ہر ایک کو کب استعمال کیا جائے۔ اگر آپ جانتے ہیں کہ آپ فنکشن کو ایک سے زیادہ بار استعمال کریں گے، تو اسے عام طریقے سے بنائیں۔ اگر آپ اسے صرف ایک جگہ کے لیے استعمال کریں گے، تو عام طور پر گمنام فنکشن استعمال کرنا بہتر ہے۔ چاہے آپ فیٹ ایرو فنکشن استعمال کریں یا زیادہ روایتی `function` نحو، یہ آپ پر منحصر ہے، لیکن آپ دیکھیں گے کہ زیادہ تر جدید ڈویلپرز `=>` کو ترجیح دیتے ہیں۔ --- ## 🚀 چیلنج کیا آپ ایک جملے میں فنکشنز اور میتھڈز کے درمیان فرق بیان کر سکتے ہیں؟ کوشش کریں! ## لیکچر کے بعد کا کوئز [لیکچر کے بعد کا کوئز](https://ff-quizzes.netlify.app/web/quiz/10) ## جائزہ اور خود مطالعہ یہ [ایرو فنکشنز کے بارے میں مزید پڑھنے](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Functions/Arrow_functions) کے قابل ہے، کیونکہ یہ کوڈ بیسز میں تیزی سے استعمال ہو رہے ہیں۔ ایک فنکشن لکھنے کی مشق کریں، اور پھر اسے اس نحو کے ساتھ دوبارہ لکھیں۔ ## اسائنمنٹ [فنکشنز کے ساتھ مزہ](assignment.md) **ڈسکلیمر**: یہ دستاویز AI ترجمہ سروس [Co-op Translator](https://github.com/Azure/co-op-translator) کا استعمال کرتے ہوئے ترجمہ کی گئی ہے۔ ہم درستگی کے لیے کوشش کرتے ہیں، لیکن براہ کرم آگاہ رہیں کہ خودکار ترجمے میں غلطیاں یا غیر درستیاں ہو سکتی ہیں۔ اصل دستاویز کو اس کی اصل زبان میں مستند ذریعہ سمجھا جانا چاہیے۔ اہم معلومات کے لیے، پیشہ ور انسانی ترجمہ کی سفارش کی جاتی ہے۔ ہم اس ترجمے کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا غلط تشریح کے ذمہ دار نہیں ہیں۔