🚘 🚵🏽 🍋 जावास्क्रिप्ट गुंजाइश और "बढ़ाने" चर और समारोह घोषणाओं 📬 🆑 🧓🏽

क्या आप जानते हैं कि यह जावास्क्रिप्ट कोड किस मूल्य का उत्पादन करेगा?

var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar();

यदि आप आश्चर्यचकित हैं कि "10" प्रदर्शित है, तो निम्न कोड आपको पूरी तरह से भ्रमित करेगा:

 var a = 1; function b() { a = 10; return; function a() {} } b(); alert(a);

इस स्थिति में, ब्राउज़र "1" प्रदर्शित करेगा। तो वास्तव में क्या चल रहा है? यद्यपि यह व्यवहार अजीब, खतरनाक और भ्रमित करने वाला लगता है, यह वास्तव में एक बहुत शक्तिशाली और अभिव्यंजक जावास्क्रिप्ट उपकरण है। मुझे नहीं पता कि इस व्यवहार का कोई आधिकारिक नाम है, लेकिन मुझे "उत्थापन" शब्द का उपयोग करना पसंद है। इस लेख में, मैं भाषा के इस तंत्र पर प्रकाश डालने की कोशिश करूंगा, लेकिन पहले, आइए जावास्क्रिप्ट में गुंजाइश के बारे में बात करते हैं।

जावास्क्रिप्ट गुंजाइश

कारणों में से एक newbies उलझन में हैं गुंजाइश है। आम तौर पर, न केवल शुरुआती। मुझे कई अनुभवी जावास्क्रिप्ट डेवलपर्स मिले हैं जो जावास्क्रिप्ट में गुंजाइश तंत्र को नहीं समझते हैं। इसका कारण यह है कि बाह्य रूप से, जावास्क्रिप्ट किसी भी अन्य सी जैसी भाषा के समान है।
आइए निम्नलिखित सी कोड को देखें:

 #include <stdio.h> int main() { int x = 1; printf("%d, ", x); // 1 if (1) { int x = 2; printf("%d, ", x); // 2 } printf("%d\n", x); // 1 }

यह कार्यक्रम 1, 2, 1 का उत्पादन करेगा, क्योंकि C और अन्य सभी C- जैसी भाषाएँ कोड ब्लॉक के स्तर पर स्कोप को लागू करती हैं । जब कोड का एक नया ब्लॉक निष्पादित किया जाता है, उदाहरण के लिए, यदि स्थिति, तो इसमें घोषित नए चर बाहरी दायरे के चर को प्रभावित नहीं करेंगे।
लेकिन जावास्क्रिप्ट के मामले में नहीं। इस कोड को फायरबग में चलाने का प्रयास करें:

 var x = 1; console.log(x); // 1 if (true) { var x = 2; console.log(x); // 2 } console.log(x); // 2

इस बार, संख्या 1, 2, 2 प्रदर्शित की जाएगी। यह इस तथ्य के कारण है कि जावास्क्रिप्ट फ़ंक्शन स्तर पर गुंजाइश का उपयोग करता है । यह बिल्कुल नहीं है जो हम सी जैसी प्रोग्रामिंग भाषाओं में देखने के अभ्यस्त हैं। कोड के ब्लॉक, जैसे कि यदि उसके तुरंत बाद आता है, तो नया स्कोप न बनाएं । केवल कार्य नए दायरे बनाते हैं।
C, C ++, C # या Java के आदी कई प्रोग्रामर के लिए, यह व्यवहार बहुत ही अप्रत्याशित और अप्रिय है। सौभाग्य से, जावास्क्रिप्ट कार्यों के लचीलेपन के लिए धन्यवाद, आप इस समस्या के आसपास काम कर सकते हैं। किसी फ़ंक्शन के अंदर एक अस्थायी स्कोप बनाने के लिए, बस निम्नलिखित करें:

 function foo() { var x = 1; if (x) { (function () { var x = 2; // -  }()); } // x   1. }

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

घोषणाएँ, नामकरण, और चर और कार्यों का "उठान"

जावास्क्रिप्ट में गुंजाइश के रूप में एक पहचानकर्ता प्रकट होने के चार मुख्य तरीके हैं:

भाषा के आंतरिक तंत्र : उदाहरण के लिए, इस दायरे में, यह और तर्क उपलब्ध हैं।
औपचारिक पैरामीटर : फ़ंक्शंस को औपचारिक पैरामीटर नाम दिया जा सकता है, जिसका कार्य फ़ंक्शन के निकाय द्वारा सीमित है।
फ़ंक्शन की घोषणा: फ़ंक्शन फू के रूप में घोषित () {}।
परिवर्तनीय घोषणाएँ : उदाहरण के लिए, var foo;

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

 function foo() { bar(); var x = 1; }

वास्तव में इस तरह व्याख्या की:

 function foo() { var x; bar(); x = 1; }

यह पता चलता है कि अगर जिस लाइन में घोषणा होती है, वह बिल्कुल निष्पादित नहीं होती है। निम्नलिखित दो कार्य समतुल्य हैं:

 function foo() { if (false) { var x = 1; } return; var y = 1; } function foo() { var x, y; if (false) { x = 1; } return; y = 1; }

ध्यान दें कि चर को मान प्रदान करना उनके घोषणा के साथ नहीं जाता है। केवल परिवर्तनशील घोषणाएँ ही उठाई जाती हैं। फ़ंक्शन के मामले में, पूरा फ़ंक्शन बढ़ जाता है। एक समारोह घोषित करने के दो मुख्य तरीके हैं, आइए उन पर नजर डालते हैं:

 function test() { foo(); // TypeError "foo is not a function" bar(); // "this will run!" var foo = function () { //  ,    'foo' alert("this won't run!"); } function bar() { //     'bar' alert("this will run!"); } } test();

इस मामले में केवल बार फ़ंक्शन उठाया जाता है। पहचानकर्ता "फू" भी उगता है, लेकिन एक अनाम फ़ंक्शन नहीं - यह जगह में रहता है।

इसलिए हमने चर और कार्यों के "बढ़ाने" के मुख्य बिंदुओं का वर्णन किया। बेशक, जावास्क्रिप्ट स्वयं नहीं होगा यदि कोई विशेष मामले नहीं थे जिसमें सब कुछ थोड़ा अधिक जटिल है।

नाम का संकल्प

ध्यान में रखने के लिए सबसे महत्वपूर्ण विशेष मामला नाम संकल्प प्रक्रिया है। याद रखें, चार तरीके हैं जिससे पहचानकर्ता गुंजाइश में दिखाई देते हैं। यह उस क्रम में है जिसमें मैंने उनका उल्लेख किया था कि नाम संकल्प होता है। सामान्य तौर पर, यदि किसी नाम को पहले से ही परिभाषित किया गया है, तो उसे उसी नाम के साथ किसी अन्य इकाई द्वारा कभी भी परिभाषित नहीं किया जाएगा। अर्थात्, एक फ़ंक्शन घोषणा एक ही नाम के साथ परिवर्तनीय घोषणाओं पर वरीयता लेती है। लेकिन इसका मतलब यह बिल्कुल भी नहीं है कि किसी वैरिएबल का मान असाइन करना फ़ंक्शन को प्रतिस्थापित नहीं करता है, इसकी परिभाषा को केवल अनदेखा किया जाएगा।
कुछ अपवाद हैं:

अंतर्निहित तर्क पहचानकर्ता अजीब व्यवहार करता है। यह ऐसा है जैसे कि फ़ंक्शन के औपचारिक तर्कों के तुरंत बाद और फ़ंक्शंस की घोषणाओं से पहले घोषित किया जाता है। इसका मतलब यह है कि यदि किसी फ़ंक्शन के पास औपचारिक तर्क तर्क हैं, तो इसे अंतर्निहित में प्राथमिकता होगी, भले ही इसे फ़ंक्शन न कहा जाए। यह एक बुरी जावास्क्रिप्ट सुविधा है। तर्क नाम के एक औपचारिक तर्क का उपयोग न करें।
यदि आप इसे एक पहचानकर्ता के रूप में उपयोग करने का प्रयास करते हैं, तो एक SyntaxError त्रुटि उत्पन्न होगी। यह एक अच्छी सुविधा है।
यदि किसी फ़ंक्शन के औपचारिक मापदंडों की सूची में उनमें से कई का नाम समान है, तो अंतिम रूप से उल्लिखित पैरामीटर पूर्वता लेता है। भले ही यह फंक्शन के बुलाए जाने पर पास नहीं हुआ हो।

नाम दिया गया फंक्शनल एक्सप्रेशंस

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

 foo(); // TypeError "foo is not a function" bar(); //  baz(); // TypeError "baz is not a function" spam(); // ReferenceError "spam is not defined" var foo = function () {}; //    ( 'foo') function bar() {}; //   ( 'bar'   ) var baz = function spam() {}; //    (  'baz') foo(); //  bar(); //  baz(); //  spam(); // ReferenceError "spam is not defined"

इस ज्ञान के साथ कोड कैसे लिखें

तो, अब आप वेरिएबल्स और फ़ंक्शन घोषणाओं के दायरे और "वृद्धि" को समझते हैं। जावास्क्रिप्ट कोड लिखते समय इसका क्या अर्थ है? सबसे महत्वपूर्ण बात यह है कि हमेशा var का उपयोग करके अपने वेरिएबल्स को घोषित करें। मैं जोर देकर कहता हूं कि आपके पास बिल्कुल एक var प्रति स्कोप है और यह इसकी शुरुआत में स्थित है। यदि आप अपने आप को ऐसा करने के लिए मजबूर करते हैं, तो आपको "उत्थान" से जुड़ी समस्याएं कभी नहीं होंगी। हालांकि, इससे उन वेरिएबल्स पर नज़र रखना मुश्किल हो सकता है जो मौजूदा दायरे में घोषित किए गए हैं। मैं JSLint का उपयोग करने की सलाह देता हूं जिसके साथ आपको ऐसा करने के लिए बाध्य किया गया है। यदि आप ऐसा करते हैं, तो आपका कोड कुछ इस तरह दिखाई देगा:

 /*jslint onevar: true [...] */ function foo(a, b, c) { var x = 1, bar, baz = "something"; }

मानक क्या कहता है

सब कुछ कैसे काम करता है यह समझने के लिए सीधे ECMAScript मानक का उपयोग करना पर्याप्त है। यहाँ यह चर घोषणाओं और क्षेत्र के बारे में क्या कहता है (खंड 12.2.2 ):

यदि फंक्शन की घोषणा के अंदर एक वैरिएबल इंस्ट्रक्शन होता है, तो वेरिएबल्स को इस फंक्शन के लिए लोकल स्कोप के अंदर घोषित किया जाता है, जैसा कि सेक्शन 10.1.3 में वर्णित है। अन्यथा, उन्हें वैश्विक दायरे में घोषित किया जाता है (अर्थात, उन्हें एक वैश्विक वस्तु के क्षेत्र के रूप में बनाया गया है जो खंड 10.1.3 में वर्णित है) {DontDelete} संपत्ति विशेषताओं का उपयोग करते हुए। निष्पादन क्षेत्र में प्रवेश करने पर चर बनाए जाते हैं। ब्लॉक एक नए निष्पादन क्षेत्र को परिभाषित नहीं करता है। केवल प्रोग्राम और फंक्शन अनाउंसमेंट एक नया स्कोप बनाते हैं। जब अपरिभाषित मान के साथ बनाया जाता है, तो वैरिएबल को आरंभिक किया जाता है। वह चर जिसके लिए इनिशियलाइज़र को परिभाषित किया गया है, वैरिएबल इंस्ट्रक्शन को निष्पादित करने के समय उसके असाइनमेंट एक्सप्रेशन का मान असाइन किया गया है, न कि उस समय पर जब चर बनाया जाता है।

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