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.
210 lines
21 KiB
210 lines
21 KiB
<!--
|
|
CO_OP_TRANSLATOR_METADATA:
|
|
{
|
|
"original_hash": "92e136090efc4341b1d51c37924c1802",
|
|
"translation_date": "2025-08-28T16:38:03+00:00",
|
|
"source_file": "2-js-basics/2-functions-methods/README.md",
|
|
"language_code": "ne"
|
|
}
|
|
-->
|
|
# जाभास्क्रिप्ट आधारभूत: मेथड्स र फङ्सन्स
|
|
|
|
|
|
> स्केच नोट [Tomomi Imura](https://twitter.com/girlie_mac) द्वारा
|
|
|
|
## प्रि-लेक्चर क्विज
|
|
[प्रि-लेक्चर क्विज](https://ff-quizzes.netlify.app)
|
|
|
|
जब हामी कोड लेख्ने कुरा सोच्दछौं, हामी सधैं हाम्रो कोड पढ्न सजिलो होस् भन्ने सुनिश्चित गर्न चाहन्छौं। यो अलि उल्टो लाग्न सक्छ, तर कोड लेखिएको भन्दा धेरै पटक पढिन्छ। डेभलपरको टूलबक्समा कोडलाई मर्मतयोग्य बनाउनको लागि एउटा मुख्य उपकरण भनेको **फङ्सन** हो।
|
|
|
|
[](https://youtube.com/watch?v=XgKsD6Zwvlc "Methods and Functions")
|
|
|
|
> 🎥 माथिको तस्बिरमा क्लिक गरेर मेथड्स र फङ्सन्सको बारेमा भिडियो हेर्नुहोस्।
|
|
|
|
> तपाईं यो पाठ [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!** देखाउनेछ। यो धेरै उपयोगी फङ्सन होइन। यदि हामी यसलाई अलि बढी लचिलो बनाउन चाहन्छौं, जस्तै कसैलाई अभिवादन गर्नको लागि नाम निर्दिष्ट गर्न अनुमति दिनु, हामी **parameter** थप्न सक्छौं।
|
|
|
|
प्यारामिटरहरू परिभाषा भागमा कोष्ठकभित्र सूचीबद्ध गरिन्छ र यसरी अल्पविरामले छुट्याइन्छ:
|
|
|
|
```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` सिन्ट्याक्स प्रयोग गर्ने निर्णय तपाईंको हो, तर तपाईंले देख्नुहुनेछ कि अधिकांश आधुनिक डेभलपर्स `=>` लाई प्राथमिकता दिन्छन्।
|
|
|
|
---
|
|
|
|
## 🚀 चुनौती
|
|
|
|
के तपाईं एक वाक्यमा फङ्सन्स र मेथड्सको बीचको भिन्नता स्पष्ट गर्न सक्नुहुन्छ? प्रयास गर्नुहोस्!
|
|
|
|
## पोस्ट-लेक्चर क्विज
|
|
[पोस्ट-लेक्चर क्विज](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) प्रयोग गरेर अनुवाद गरिएको हो। हामी शुद्धताको लागि प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादहरूमा त्रुटि वा अशुद्धता हुन सक्छ। यसको मूल भाषा मा रहेको मूल दस्तावेज़लाई आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीको लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुने छैनौं। |