लूप्स में जावास्क्रिप्ट क्लोजर को समझना: व्यावहारिक उदाहरण

लूप्स में जावास्क्रिप्ट क्लोजर को समझना: व्यावहारिक उदाहरण
लूप्स में जावास्क्रिप्ट क्लोजर को समझना: व्यावहारिक उदाहरण

जावास्क्रिप्ट में लूप क्लोजर को सुलझाना

लूप के अंदर क्लोजर का उपयोग करते समय जावास्क्रिप्ट डेवलपर्स को अक्सर अप्रत्याशित व्यवहार का सामना करना पड़ता है। यह समस्या भ्रम पैदा कर सकती है, विशेषकर उन लोगों के लिए जो बंद करने की अवधारणा से नए हैं।

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

आज्ञा विवरण
let एक ब्लॉक-स्कोप्ड स्थानीय वैरिएबल घोषित करता है, वैकल्पिक रूप से इसे एक मान पर आरंभ करता है। यह सुनिश्चित करने के लिए उपयोग किया जाता है कि लूप के प्रत्येक पुनरावृत्ति का अपना दायरा हो।
const एक ब्लॉक-स्कोप्ड, केवल पढ़ने योग्य नामित स्थिरांक की घोषणा करता है। एक फ़ंक्शन या वेरिएबल बनाने के लिए उपयोग किया जाता है जिसका मान नहीं बदलना चाहिए।
Promise एक अतुल्यकालिक ऑपरेशन के अंतिम समापन (या विफलता) और उसके परिणामी मूल्य का प्रतिनिधित्व करता है।
setTimeout किसी फ़ंक्शन को कॉल करता है या मिलीसेकंड की निर्दिष्ट संख्या के बाद किसी अभिव्यक्ति का मूल्यांकन करता है।
addEventListener मौजूदा इवेंट हैंडलर को अधिलेखित किए बिना एक इवेंट हैंडलर को एक निर्दिष्ट तत्व से जोड़ता है।
IIFE तुरंत फ़ंक्शन अभिव्यक्ति लागू की गई। एक फ़ंक्शन जो परिभाषित होते ही चालू हो जाता है। लूप में स्थानीय स्कोप बनाने के लिए उपयोग किया जाता है।
for...in किसी वस्तु के असंख्य गुणों को मनमाने क्रम में दोहराता है।
for...of एक विशिष्ट क्रम में, पुनरावृत्त वस्तु (जैसे एक सरणी या एक स्ट्रिंग) के मूल्यों पर पुनरावृत्ति करता है।

लूप्स में जावास्क्रिप्ट क्लोजर को समझना

पिछले उदाहरणों में प्रदान की गई स्क्रिप्ट जावास्क्रिप्ट में लूप के भीतर बंद होने की सामान्य समस्या का समाधान करती हैं। ए का उपयोग करते समय var एक लूप के भीतर घोषणा, सभी पुनरावृत्तियों का कार्य दायरा समान होता है। यही कारण है कि, पहले उदाहरण में, आउटपुट तीन बार "मेरा मान: 3" है। समाधान का उपयोग करना है let, जो एक ब्लॉक स्कोप बनाता है जो प्रत्येक पुनरावृत्ति के लिए सही मान बनाए रखता है। यह दृष्टिकोण सुनिश्चित करता है कि प्रत्येक पुनरावृत्ति का अपना दायरा हो, इस प्रकार फ़ंक्शन को कॉल करने पर सही मान सुरक्षित रहता है। स्क्रिप्ट दर्शाती है कि घोषणा को कैसे बदला जा रहा है var को let समस्या को ठीक करता है और इच्छानुसार "मेरा मान: 0", "मेरा मान: 1", और "मेरा मान: 2" लॉग करता है।

एसिंक्रोनस कोड के लिए, वही क्लोजर समस्या उत्पन्न हो सकती है। का उपयोग करते हुए Promises और setTimeout के साथ कार्य करता है let यह सुनिश्चित करता है कि प्रत्येक एसिंक्रोनस कॉल सही पुनरावृत्ति मान बनाए रखे। स्क्रिप्ट इसका उपयोग करके दिखाती है wait साथ let, प्रत्येक हल किया गया वादा अपेक्षित मान लॉग करता है। इवेंट श्रोताओं को भी इसी तरह की समस्याओं का सामना करना पड़ सकता है; हालाँकि, श्रोता फ़ंक्शन को एक में लपेटना IIFE (तत्काल आमंत्रित फ़ंक्शन अभिव्यक्ति) प्रत्येक पुनरावृत्ति के लिए एक नया दायरा बनाकर सही मान प्राप्त करने में मदद करता है। का उपयोग for...in और for...of लूप्स आगे क्लोजर में स्कोपिंग के महत्व को प्रदर्शित करता है, यह दर्शाता है कि इंडेक्स और वैल्यू का उपयोग करके सही ढंग से कैसे कैप्चर किया जाए IIFE प्रत्येक लूप पुनरावृत्ति के लिए अलग-अलग दायरे बनाने के लिए।

लेट के साथ जावास्क्रिप्ट लूप्स में क्लोजर मुद्दों को हल करना

जावास्क्रिप्ट (ES6)

let funcs = [];
// Let's create 3 functions
for (let i = 0; i < 3; i++) {
  // and store them in funcs
  funcs[i] = function() {
    // each should log its value.
    console.log("My value:", i);
  };
}
for (let j = 0; j < 3; j++) {
  // and now let's run each one to see
  funcs[j]();
}

एसिंक्रोनस कोड में सही क्लोजर मान सुनिश्चित करना

जावास्क्रिप्ट (ES6)

const wait = (ms) => new Promise((resolve, reject) => setTimeout(resolve, ms));
for (let i = 0; i < 3; i++) {
  // Log `i` as soon as each promise resolves.
  wait(i * 100).then(() => console.log(i));
}

IIFE का उपयोग करके इवेंट श्रोताओं में सही समापन

जावास्क्रिप्ट (ES6)

var buttons = document.getElementsByTagName("button");
// Let's create 3 functions
for (var i = 0; i < buttons.length; i++) {
  // as event listeners
  (function(i) {
    buttons[i].addEventListener("click", function() {
      // each should log its value.
      console.log("My value:", i);
    });
  })(i);
}

फॉर...इन और फॉर...ऑफ लूप्स के साथ सही क्लोजर

जावास्क्रिप्ट (ES6)

const arr = [1, 2, 3];
const fns = [];
for (const i in arr) {
  fns.push(((i) => () => console.log("index:", i))(i));
}
for (const v of arr) {
  fns.push(((v) => () => console.log("value:", v))(v));
}
for (const n of arr) {
  const obj = { number: n };
  fns.push(((n, obj) => () => console.log("n:", n, "|", "obj:", JSON.stringify(obj)))(n, obj));
}
for (const f of fns) {
  f();
}

उन्नत जावास्क्रिप्ट फ़ंक्शंस में क्लोजर के उपयोग की खोज

क्लोजर जावास्क्रिप्ट में एक मौलिक अवधारणा है जो किसी फ़ंक्शन को उसके संलग्न दायरे से वेरिएबल्स तक पहुंचने की अनुमति देता है, भले ही वह दायरा बंद हो गया हो। मेमोइज़ेशन, करीइंग और कार्यात्मक प्रोग्रामिंग जैसे उन्नत फ़ंक्शन बनाते समय यह सुविधा विशेष रूप से शक्तिशाली होती है। उदाहरण के लिए, मेमोइज़ेशन महंगे फ़ंक्शन कॉल के परिणामों को याद रखने के लिए क्लोजर का लाभ उठाता है और वही इनपुट दोबारा होने पर कैश्ड परिणाम लौटाता है। क्लोजर का उपयोग करके, हम अधिक कुशल और अनुकूलित कोड बना सकते हैं जो प्रदर्शन को बढ़ाता है, विशेष रूप से फाइबोनैचि अनुक्रमों की गणना जैसे पुनरावर्ती कार्यों में।

क्लोजर का एक और उन्नत उपयोग जावास्क्रिप्ट ऑब्जेक्ट्स के भीतर निजी चर और फ़ंक्शन बनाना, निजी तरीकों और गुणों का अनुकरण करना है। इस तकनीक को अक्सर मॉड्यूल पैटर्न में नियोजित किया जाता है और कार्यक्षमता को समाहित करने और वैश्विक दायरे को प्रदूषित करने से बचने के लिए तुरंत फ़ंक्शन एक्सप्रेशन (IIFE) को लागू किया जाता है। इसके अलावा, क्लोजर इवेंट हैंडलिंग और एसिंक्रोनस प्रोग्रामिंग में महत्वपूर्ण भूमिका निभाते हैं, जहां वे समय के साथ स्थिति और संदर्भ को बनाए रखने में मदद करते हैं। क्लोजर को समझना और प्रभावी ढंग से उपयोग करना आपके जावास्क्रिप्ट प्रोग्रामिंग कौशल को महत्वपूर्ण रूप से बढ़ा सकता है और आपको अधिक मॉड्यूलर, पुन: प्रयोज्य और रखरखाव योग्य कोड लिखने में सक्षम बना सकता है।

जावास्क्रिप्ट क्लोजर के बारे में अक्सर पूछे जाने वाले प्रश्न

  1. जावास्क्रिप्ट में क्लोजर क्या है?
  2. क्लोजर एक ऐसा फ़ंक्शन है जो अपने शाब्दिक दायरे तक पहुंच बनाए रखता है, तब भी जब फ़ंक्शन उस दायरे के बाहर निष्पादित होता है।
  3. लूप्स में क्लोजर क्यों होते हैं?
  4. लूप में क्लोजर इसलिए होते हैं क्योंकि लूप ऐसे फ़ंक्शन बनाता है जो समान वैरिएबल संदर्भ को कैप्चर करते हैं, जिससे यदि सही ढंग से प्रबंधित नहीं किया जाता है तो अप्रत्याशित व्यवहार होता है।
  5. हम लूप्स में क्लोजर समस्याओं को कैसे ठीक कर सकते हैं?
  6. का उपयोग करते हुए let के बजाय var लूप में या उपयोग करके IIFE (तत्काल आमंत्रित फ़ंक्शन एक्सप्रेशन) प्रत्येक पुनरावृत्ति के लिए एक नया दायरा बनाकर क्लोजर मुद्दों को ठीक कर सकता है।
  7. आईआईएफई क्या है?
  8. एक IIFE एक ऐसा फ़ंक्शन है जिसे बनने के तुरंत बाद निष्पादित किया जाता है, जिसका उपयोग अक्सर एक नया दायरा बनाने और परिवर्तनीय संघर्षों से बचने के लिए किया जाता है।
  9. क्या क्लोजर का उपयोग एसिंक्रोनस प्रोग्रामिंग में किया जा सकता है?
  10. हाँ, वादे और कॉलबैक जैसे अतुल्यकालिक संचालन में स्थिति और संदर्भ को बनाए रखने के लिए अतुल्यकालिक प्रोग्रामिंग में क्लोजर आवश्यक हैं।
  11. संस्मरण क्या है और इसे बंद करने से कैसे मदद मिलती है?
  12. मेमोइज़ेशन महंगे फ़ंक्शन कॉल के परिणामों को कैश करने के लिए एक अनुकूलन तकनीक है। क्लोजर कई फ़ंक्शन कॉलों में कैश तक पहुंच बनाए रखने में मदद करता है।
  13. इवेंट प्रबंधन में क्लोजर कैसे मदद करते हैं?
  14. क्लोजर इवेंट हैंडलर्स के लिए आवश्यक वेरिएबल्स की स्थिति को बनाए रखता है, जिससे यह सुनिश्चित होता है कि इवेंट ट्रिगर होने पर वे सही ढंग से काम करते हैं।
  15. जावास्क्रिप्ट में मॉड्यूल पैटर्न क्या है?
  16. मॉड्यूल पैटर्न निजी चर और फ़ंक्शन बनाने, कार्यक्षमता को समाहित करने और वैश्विक दायरे के प्रदूषण से बचने के लिए क्लोजर का उपयोग करता है।
  17. क्या क्लोजर जावास्क्रिप्ट में निजी तरीकों का अनुकरण कर सकता है?
  18. हां, क्लोजर वैरिएबल और फ़ंक्शंस को केवल फ़ंक्शन के दायरे में पहुंच योग्य रखकर निजी तरीकों का अनुकरण कर सकते हैं जहां उन्हें परिभाषित किया गया है।

लूप्स में जावास्क्रिप्ट क्लोजर पर अंतिम विचार

जावास्क्रिप्ट में क्लोजर में महारत हासिल करना, विशेष रूप से लूप के भीतर, पूर्वानुमानित और कुशल कोड लिखने के लिए महत्वपूर्ण है। लाभ उठाकर let, Promises, और IIFE, डेवलपर्स सामान्य नुकसान से बच सकते हैं और सही वैरिएबल स्कोपिंग सुनिश्चित कर सकते हैं। यह समझ अतुल्यकालिक कार्यों और इवेंट-संचालित प्रोग्रामिंग को संभालने की क्षमता को बढ़ाती है, जिससे अंततः अधिक मजबूत अनुप्रयोग सामने आते हैं।