firebug - Why aren't these two bits of JavaScript equivalent? -

में jquery 1.4.2, ff 3.6.6:

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

ये दो तरीके एक दूसरे से अलग क्यों हैं? प्रत्येक में आप तत्व को खोजने के लिए एक चयनकर्ता का उपयोग करते हैं और इसके लिए एक इवेंट जोड़ते हैं।

  & lt; head & gt; & Lt; script type = "text / javascript" src = "/ media / js / jquery.js" & gt; & lt; / स्क्रिप्ट & gt; & LT; स्क्रिप्ट & gt; $ (Document) .ready (function () {$ ("# one")। Mouseenter (function () {console.log ("एक")}) $ ("# two")। Mouseenter (function () {console ("दो")} $ ("# तीन")। माउससेंटर (फ़ंक्शन () {console.log ("तीन"}}) // नाम = ['एक', 'दो', 'तीन'] ; // के लिए (नामों में k) {// id = names [k] // $ ("#" + id) .mouseenter (function () {console.log (id)})}}}) & lt; / लिपि & gt; & Lt; / head & gt; & LT; बॉडी & gt; & Lt; span id = "एक" & gt; एक & lt; / span & gt; & Lt; p & gt; & lt; span id = "दो" & gt; दो & lt; / span & gt; & lt; / p & gt; & Lt; p & gt; & lt; span id = "three" & gt; तीन & lt; / span & gt; & lt; / p & gt; & Lt; / body & gt;  

आपको लूप में में होना होगा।

क्लोज़र में संलग्न वेरिएबल्स एक ही सिंगल पर्यावरण को साझा करता है, इसलिए जब mousecenter कॉलबैक कहा जाता है, तो लूप अपना कोर्स चलाएगा और id चर को नाम सरणी के अंतिम तत्व के मान की ओर इशारा कर दिया जाएगा।

यह बहुत मुश्किल विषय हो सकता है, यदि आप परिचित नहीं हैं, । आप संक्षिप्त परिचय के लिए निम्नलिखित लेख को देखना चाहते हैं:

आप किसी फ़ंक्शन फ़ैक्टरी का उपयोग करके और भी अधिक क्लोजर के साथ इसे हल कर सकते हैं: < / P>

  फ़ंक्शन makeMouseEnterCallback (id) {return function () {console.log (id); }; } // ... var id, k, names = ['one', 'two', 'three']; के लिए (k = 0; k & lt; names.length; k ++) {आईडी = नाम [के]; $ ("#" + आईडी) .माउससेटर (मेकमाउसेएन्टर कॉलबैक (आईडी)); }  

आप उपर्युक्त फ़ंक्शन फ़ैक्टरी को इनलाइन भी कर सकते हैं:

  var id, k, names = ['one', 'two', ' तीन ']; के लिए (k = 0; k & lt; names.length; k ++) {आईडी = नाम [के]; $ ("#" + Id) .mouseenter ((फ़ंक्शन (p_id) {वापसी फ़ंक्शन () {console.log (p_id);}}}} (id)); }  

किसी भी अन्य हल के रूप में हो सकता है, जिसमें प्रत्येक पुनरावृत्ति को अपने दायरे में शामिल किया जा सकता है:

  var k, names = ['one', 'two ',' तीन ']; के लिए (k = 0; k & lt; names.length; k ++) {(फ़ंक्शन () {var id = names [k]; $ ("#" + id) .mouseenter (function () {console.log (id) });}) (); }  

हालांकि इस समस्या से संबंधित नहीं है, आम तौर पर यह सिफारिश की जाती है कि एक लूप में लूप का उपयोग करने से बचने के लिए सिफारिश की जाती है, जैसा कि एक सरणी के आइटम पर पुनरावृति करना है नीचे एक टिप्पणी () इसके अतिरिक्त, अपने बयान को अर्धविराम के साथ स्पष्ट रूप से समाप्त करना भी जावास्क्रिप्ट में एक अच्छा अभ्यास माना जाता है।