You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
225 lines
23 KiB
225 lines
23 KiB
<!--
|
|
CO_OP_TRANSLATOR_METADATA:
|
|
{
|
|
"original_hash": "5958491a27a8dd97a4777f34f9214bca",
|
|
"translation_date": "2025-10-20T21:31:31+00:00",
|
|
"source_file": "2-js-basics/2-functions-methods/README.md",
|
|
"language_code": "ne"
|
|
}
|
|
-->
|
|
# जाभास्क्रिप्ट आधारभूत: मेथड्स र फङ्सन्स
|
|
|
|
|
|
> स्केच नोट [टोमोमी इमुरा](https://twitter.com/girlie_mac) द्वारा
|
|
|
|
## लेक्चर अघि क्विज
|
|
[लेक्चर अघि क्विज](https://ff-quizzes.netlify.app)
|
|
|
|
जब हामी कोड लेख्ने कुरा सोच्दछौं, हामी सधैं हाम्रो कोड पढ्न सजिलो बनाउने सुनिश्चित गर्न चाहन्छौं। यो अलि उल्टो लाग्न सक्छ, तर कोड लेखिएको भन्दा धेरै पटक पढिन्छ। डेभलपरको टूलबक्समा एक मुख्य उपकरण भनेको **फङ्सन** हो जसले कोडलाई मर्मतयोग्य बनाउँछ।
|
|
|
|
[](https://youtube.com/watch?v=XgKsD6Zwvlc "मेथड्स र फङ्सन्स")
|
|
|
|
> 🎥 माथिको तस्बिरमा क्लिक गरेर मेथड्स र फङ्सन्सको बारेमा भिडियो हेर्नुहोस्।
|
|
|
|
> तपाईं यो पाठ [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-functions/?WT.mc_id=academic-77807-sagibbon) मा लिन सक्नुहुन्छ!
|
|
|
|
## फङ्सन्स
|
|
|
|
फङ्सन भनेको मुख्य रूपमा कोडको एउटा ब्लक हो जसलाई हामी आवश्यक परेको बेला चलाउन सक्छौं। यो त्यस्तो अवस्थामा उपयुक्त हुन्छ जहाँ हामीले एउटै काम धेरै पटक गर्नुपर्छ; विभिन्न स्थानमा तर्क दोहोर्याउनुको सट्टा (जसले अपडेट गर्न गाह्रो बनाउँछ), हामी यसलाई एक स्थानमा केन्द्रित गर्न सक्छौं र जब आवश्यक पर्दछ तब यसलाई चलाउन सक्छौं - तपाईंले अन्य फङ्सनबाट पनि फङ्सनलाई कल गर्न सक्नुहुन्छ!
|
|
|
|
फङ्सनलाई नाम दिन सक्ने क्षमता पनि उत्तिकै महत्त्वपूर्ण छ। यो सामान्य लाग्न सक्छ, तर नामले कोडको भागलाई छिटो डकुमेन्ट गर्न मद्दत गर्दछ। तपाईं यसलाई बटनमा लेबलको रूपमा सोच्न सक्नुहुन्छ। यदि मैले "टाइमर रद्द गर्नुहोस्" लेखिएको बटनमा क्लिक गरेँ भने, मलाई थाहा छ यो घडी चल्न रोक्नेछ।
|
|
|
|
## फङ्सन बनाउने र कल गर्ने
|
|
|
|
फङ्सनको सिन्ट्याक्स निम्नानुसार देखिन्छ:
|
|
|
|
```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 seconds has elapsed** सन्देश देख्नुहुनेछ।
|
|
|
|
```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` सिन्ट्याक्स प्रयोग गर्ने निर्णय गर्न सक्नुहुन्छ, तर तपाईंले देख्नुहुनेछ कि अधिकांश आधुनिक डेभलपरहरूले `=>` लाई प्राथमिकता दिन्छन्।
|
|
|
|
---
|
|
|
|
|
|
|
|
## 🚀 चुनौती
|
|
|
|
के तपाईं एक वाक्यमा फङ्सन र मेथडको बीचको फरकलाई स्पष्ट गर्न सक्नुहुन्छ? प्रयास गर्नुहोस्!
|
|
|
|
## GitHub Copilot Agent चुनौती 🚀
|
|
|
|
Agent मोड प्रयोग गरेर निम्न चुनौती पूरा गर्नुहोस्:
|
|
|
|
**विवरण:** यस पाठमा समेटिएका विभिन्न फङ्सन अवधारणाहरू प्रदर्शन गर्ने गणितीय फङ्सनहरूको युटिलिटी लाइब्रेरी बनाउनुहोस्, जसमा प्यारामिटरहरू, डिफल्ट मानहरू, रिटर्न मानहरू, र एरो फङ्सनहरू समावेश छन्।
|
|
|
|
**प्रम्ट:** `mathUtils.js` नामक जाभास्क्रिप्ट फाइल बनाउनुहोस् जसमा निम्न फङ्सनहरू समावेश छन्:
|
|
1. दुई प्यारामिटर लिने र तिनीहरूको योग फिर्ता गर्ने `add` फङ्सन
|
|
2. डिफल्ट प्यारामिटर मानहरू भएको `multiply` फङ्सन (दोस्रो प्यारामिटरको डिफल्ट मान 1)
|
|
3. एउटा नम्बर लिने र यसको वर्ग फिर्ता गर्ने एरो फङ्सन `square`
|
|
4. अर्को फङ्सनलाई प्यारामिटरको रूपमा स्वीकार गर्ने र दुई नम्बरमा उक्त फङ्सन लागू गर्ने `calculate` फङ्सन
|
|
5. प्रत्येक फङ्सनलाई उपयुक्त परीक्षण केसहरूसँग कल गर्ने प्रदर्शन गर्नुहोस्
|
|
|
|
## लेक्चर पछि क्विज
|
|
[लेक्चर पछि क्विज](https://ff-quizzes.netlify.app)
|
|
|
|
## समीक्षा र आत्म अध्ययन
|
|
|
|
[एरो फङ्सनहरूमा अलि बढी पढ्न](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Functions/Arrow_functions) लायक छ, किनकि तिनीहरू कोड बेसहरूमा बढ्दो रूपमा प्रयोग गरिन्छ। फङ्सन लेख्ने अभ्यास गर्नुहोस्, र त्यसपछि यस सिन्ट्याक्सको साथ पुनः लेख्नुहोस्।
|
|
|
|
## असाइनमेन्ट
|
|
|
|
[फङ्सनहरूसँग रमाइलो](assignment.md)
|
|
|
|
---
|
|
|
|
**अस्वीकरण**:
|
|
यो दस्तावेज़ AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरेर अनुवाद गरिएको छ। हामी शुद्धताको लागि प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादमा त्रुटिहरू वा अशुद्धताहरू हुन सक्छ। यसको मूल भाषा मा रहेको दस्तावेज़लाई आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीको लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुने छैनौं। |