JavaScript Functions और Scope

JavaScript Functions और Scope: हिंदी में सम्पूर्ण गाइड

JavaScript Functions और Scope

जावास्क्रिप्ट में फंक्शन्स और स्कोप को समझना बेसिक से एडवांस्ड प्रोग्रामिंग की ओर बढ़ने का पहला कदम है। इस विस्तृत गाइड में हम इन कॉन्सेप्ट्स को 30+ प्रैक्टिकल उदाहरणों के साथ समझेंगे।

1. Functions क्या हैं?

फंक्शन जावास्क्रिप्ट का सबसे महत्वपूर्ण बिल्डिंग ब्लॉक है। यह कोड का एक ब्लॉक होता है जिसे हम बार-बार इस्तेमाल कर सकते हैं।

रियल लाइफ उदाहरण: मान लीजिए आप एक कैलकुलेटर बना रहे हैं। जोड़, घटाव, गुणा, भाग के लिए अलग-अलग फंक्शन बना सकते हैं और जब भी जरूरत हो इन्हें कॉल कर सकते हैं।

1.1 फंक्शन बनाने के तरीके

Function Declaration

function greet(name) {
  return "नमस्ते " + name;
}
console.log(greet("राहुल"));

सबसे बेसिक तरीका, पूरे प्रोग्राम में कहीं भी कॉल किया जा सकता है

Function Expression

const greet = function(name) {
  return "नमस्ते " + name;
};
console.log(greet("प्रिया"));

फंक्शन को वेरिएबल में स्टोर करना, डिफाइन होने के बाद ही कॉल कर सकते हैं

Arrow Function (ES6)

const greet = (name) => {
  return "नमस्ते " + name;
};
console.log(greet("अमित"));

नया और शॉर्ट सिंटैक्स, 'this' की अलग बाइंडिंग

1.2 फंक्शन पैरामीटर्स और आर्ग्युमेंट्स

फंक्शन को इनपुट देने के लिए हम पैरामीटर्स का उपयोग करते हैं:

// a और b पैरामीटर्स हैं
function add(a, b) {
  return a + b;
}

// 5 और 3 आर्ग्युमेंट्स हैं
console.log(add(5, 3)); // 8
नोट: जावास्क्रिप्ट में फंक्शन कितने भी पैरामीटर्स ले सकता है, भले ही आप कम या ज्यादा आर्ग्युमेंट्स पास करें।

1.3 डिफॉल्ट पैरामीटर्स (ES6)

अगर कोई आर्ग्युमेंट नहीं दिया जाए तो डिफॉल्ट वैल्यू का उपयोग कर सकते हैं:

function greet(name = "मेहमान") {
  console.log("नमस्ते " + name);
}

greet("रवि"); // नमस्ते रवि
greet();        // नमस्ते मेहमान

2. Function Return और Execution Context

फंक्शन से वैल्यू वापस लेने के लिए return कीवर्ड का उपयोग करते हैं:

// age को चेक करके true या false रिटर्न करता है
function isAdult(age) {
  if(age >= 18) {
    return true;
  } else {
    return false;
  }
}

console.log(isAdult(20)); // true
ध्यान दें: return स्टेटमेंट के बाद फंक्शन का एक्जिक्यूशन रुक जाता है। return के बाद का कोड नहीं चलेगा।

2.1 फंक्शन्स फर्स्ट क्लास सिटिजन

जावास्क्रिप्ट में फंक्शन्स को वेरिएबल्स की तरह ट्रीट किया जाता है:

// फंक्शन को वेरिएबल में असाइन करना
const operation = function(a, b) {
  return a * b;
};

// फंक्शन को दूसरे फंक्शन में पास करना
function calculate(a, b, func) {
  return func(a, b);
}

console.log(calculate(5, 4, operation)); // 20

3. Scope और Variable Access

स्कोप निर्धारित करता है कि वेरिएबल्स को प्रोग्राम के किन हिस्सों में एक्सेस किया जा सकता है।

3.1 ग्लोबल स्कोप

const globalVar = "मैं हर जगह उपलब्ध हूँ";

function checkScope() {
  console.log(globalVar); // एक्सेस कर सकते हैं
}

checkScope();
console.log(globalVar); // यहाँ भी एक्सेस कर सकते हैं

3.2 लोकल (फंक्शन) स्कोप

function showMessage() {
  const message = "मैं सिर्फ इस फंक्शन में हूँ";
  console.log(message); // काम करेगा
}

showMessage();
console.log(message); // Error: message is not defined

3.3 ब्लॉक स्कोप (let/const)

if (true) {
  const blockVar = "मैं सिर्फ इस ब्लॉक में हूँ";
  console.log(blockVar); // काम करेगा
}

console.log(blockVar); // Error: blockVar is not defined
नया सीखने वालों के लिए: var की जगह हमेशा let और const का उपयोग करें क्योंकि ये ब्लॉक स्कोप प्रदान करते हैं।

4. Lexical Scope और Closures

जावास्क्रिप्ट में स्कोप लेक्सिकल होता है, मतलब स्कोप फंक्शन के डिक्लेयर होने के स्थान से निर्धारित होता है, न कि कॉल करने के स्थान से।

function outer() {
  const outerVar = "बाहरी वेरिएबल";

  function inner() {
    console.log(outerVar); // inner() outer() के स्कोप को एक्सेस कर सकता है
  }

  return inner;
}

const closureFn = outer();
closureFn(); // "बाहरी वेरिएबल"

4.1 Closure का प्रैक्टिकल उपयोग

function createCounter() {
  let count = 0;

  return {
    increment: function() {
      count++;
      return count;
    },
    decrement: function() {
      count--;
      return count;
    }
  };
}

const counter = createCounter();
console.log(counter.increment()); // 1
console.log(counter.increment()); // 2
console.log(counter.decrement()); // 1

5. Immediately Invoked Function Expressions (IIFE)

IIFE वह फंक्शन होता है जो डिफाइन होते ही अपने आप एक्जिक्यूट हो जाता है:

(function() {
  console.log("IIFE तुरंत चल गया");
})();

// पैरामीटर्स के साथ
(function(name) {
  console.log("नमस्ते " + name);
})("राजेश");

6. Callback Functions

कॉलबैक फंक्शन वह फंक्शन होता है जिसे दूसरे फंक्शन में आर्ग्युमेंट के रूप में पास किया जाता है:

function calculate(a, b, operation) {
  return operation(a, b);
}

function add(x, y) {
  return x + y;
}

function multiply(x, y) {
  return x * y;
}

console.log(calculate(5, 3, add)); // 8
console.log(calculate(5, 3, multiply)); // 15

7. Higher-Order Functions

वह फंक्शन जो दूसरे फंक्शन को पैरामीटर के रूप में ले या फंक्शन रिटर्न करे:

// फंक्शन रिटर्न करने वाला HOF
function multiplier(factor) {
  return function(number) {
    return number * factor;
  };
}

const double = multiplier(2);
console.log(double(5)); // 10

const triple = multiplier(3);
console.log(triple(5)); // 15

8. Recursion (पुनरावर्ती फंक्शन्स)

वह फंक्शन जो खुद को ही कॉल करता है:

function factorial(n) {
  if (n === 0 || n === 1) {
    return 1;
  }
  return n * factorial(n - 1);
}

console.log(factorial(5)); // 120 (5! = 5×4×3×2×1 = 120)

9. प्रैक्टिकल प्रोजेक्ट्स

9.1 टेम्परेचर कन्वर्टर

function convertTemp(temp, unit) {
  if (unit === 'C') {
    return (temp * 9/5) + 32; // Celsius to Fahrenheit
  } else if (unit === 'F') {
    return (temp - 32) * 5/9; // Fahrenheit to Celsius
  } else {
    return "अमान्य यूनिट";
  }
}

console.log(convertTemp(25, 'C')); // 77 (Fahrenheit)
console.log(convertTemp(98, 'F')); // 36.66... (Celsius)

9.2 साधारण कैलकुलेटर

function calculator(operation, ...numbers) {
  switch(operation) {
    case 'add':
      return numbers.reduce((sum, num) => sum + num, 0);
    case 'subtract':
      return numbers.reduce((result, num) => result - num);
    case 'multiply':
      return numbers.reduce((product, num) => product * num, 1);
    case 'divide':
      return numbers.reduce((result, num) => result / num);
    default:
      return "अमान्य ऑपरेशन";
  }
}

console.log(calculator('add', 5, 3, 2)); // 10
console.log(calculator('multiply', 2, 4, 5)); // 40

10. सामान्य गलतियाँ और बेस्ट प्रैक्टिसेज

10.1 सामान्य गलतियाँ

  • फंक्शन कॉल में पैरामीटर्स की संख्या गलत देना
  • return स्टेटमेंट भूल जाना
  • ग्लोबल वेरिएबल्स का अत्यधिक उपयोग

10.2 बेस्ट प्रैक्टिसेज

  • फंक्शन का एक ही काम होना चाहिए (Single Responsibility Principle)
  • डिस्क्रिप्टिव नामों का उपयोग करें
  • फंक्शन को छोटा और स्पष्ट रखें

निष्कर्ष

इस विस्तृत गाइड में हमने जावास्क्रिप्ट फंक्शन्स और स्कोप के सभी पहलुओं को कवर किया है। अभ्यास के लिए इन उदाहरणों को खुद ट्राई करें और अपने प्रोजेक्ट्स में इम्प्लीमेंट करें।

अगला कदम: अब जब आप फंक्शन्स और स्कोप समझ गए हैं, तो जावास्क्रिप्ट में ऑब्जेक्ट्स और प्रोटोटाइप्स सीखकर अपनी ज्ञान को और बढ़ाएं।
और नया पुराने