ये 2 उदाहरण लें:
var A = function() { this.hey = function() { alert('from A') } };
बनाम
var A = function() {}
A.prototype.hey = function() { alert('from prototype') };
यहां ज्यादातर लोगों (विशेष रूप से शीर्ष-रेटेड उत्तर) ने यह बताने की कोशिश की कि वे WHY की व्याख्या किए बिना कैसे अलग हैं। मुझे लगता है कि यह गलत है और यदि आप बुनियादी बातों को पहले समझ लेते हैं, तो अंतर स्पष्ट हो जाएगा। आइए पहले बुनियादी बातों को समझाने की कोशिश करें ...
क) एक फ़ंक्शन जावास्क्रिप्ट में एक वस्तु है। जावास्क्रिप्ट में हर वस्तु को एक आंतरिक संपत्ति मिलती है (मतलब, आप इसे अन्य गुणों की तरह एक्सेस नहीं कर सकते हैं, शायद क्रोम जैसे ब्राउज़रों में छोड़कर), जिसे अक्सर संदर्भित किया जाता है __proto__(आप वास्तव anyObject.__proto__में इसे देखने के लिए क्रोम में टाइप कर सकते हैं। यह सिर्फ यही है। , एक संपत्ति, और कुछ नहीं। जावास्क्रिप्ट में एक संपत्ति = एक वस्तु के अंदर एक चर, और कुछ नहीं। चर क्या करते हैं? वे चीजों को इंगित करते हैं।
तो यह __proto__संपत्ति किस ओर इशारा करती है? खैर, आमतौर पर एक और वस्तु (हम बाद में समझाएंगे)। __proto__संपत्ति के लिए जावास्क्रिप्ट को बल देने का एकमात्र तरीका किसी अन्य वस्तु को इंगित नहीं करना है var newObj = Object.create(null)। यहां तक कि अगर आप ऐसा करते हैं, तो __proto__संपत्ति अभी भी ऑब्जेक्ट की संपत्ति के रूप में मौजूद है, बस यह किसी अन्य ऑब्जेक्ट को इंगित नहीं करता है, यह इंगित करता है null।
यहाँ वह जगह है जहाँ ज्यादातर लोग भ्रमित होते हैं:
जब आप जावास्क्रिप्ट में एक नया फ़ंक्शन बनाते हैं (जो एक वस्तु के रूप में अच्छी तरह से याद है?), जिस क्षण इसे परिभाषित किया जाता है, जावास्क्रिप्ट स्वचालित रूप से उस फ़ंक्शन पर एक नई संपत्ति बनाता है जिसे कहा जाता है prototype। कोशिश करो:
var A = [];
A.prototype // undefined
A = function() {}
A.prototype // {} // got created when function() {} was defined
A.prototype__proto__संपत्ति से पूरी तरह अलग है । हमारे उदाहरण में, 'A' में अब 'प्रोटोटाइप' नामक TWO गुण हैं और __proto__। यह लोगों के लिए एक बड़ा भ्रम है। prototypeऔर __proto__गुण किसी भी तरह से संबंधित नहीं हैं, वे अलग-अलग चीजें हैं जो अलग-अलग मूल्यों की ओर इशारा करते हैं।
आप आश्चर्यचकित हो सकते हैं: जावास्क्रिप्ट में __proto__हर एक वस्तु पर संपत्ति क्यों बनाई गई है? खैर, एक शब्द: प्रतिनिधिमंडल । जब आप किसी ऑब्जेक्ट को किसी ऑब्जेक्ट पर कॉल करते हैं और ऑब्जेक्ट उसके पास नहीं होता है, तो जावास्क्रिप्ट ऑब्जेक्ट द्वारा संदर्भित ऑब्जेक्ट __proto__को यह देखने के लिए देखता है कि क्या यह उसके पास है। यदि यह नहीं है, तो यह उस वस्तु की __proto__संपत्ति और इसी तरह से दिखता है ... जब तक कि श्रृंखला समाप्त नहीं हो जाती। इस प्रकार नाम प्रोटोटाइप श्रृंखला । बेशक, यदि __proto__कोई वस्तु इंगित नहीं करती है और इसके बजाय null, अच्छी तरह से कठिन भाग्य को इंगित करती है , तो जावास्क्रिप्ट का एहसास होता है और आपको undefinedसंपत्ति के लिए वापस कर देगा ।
आपको यह भी आश्चर्य हो सकता है कि prototypeजब आप फ़ंक्शन को परिभाषित करते हैं , तो जावास्क्रिप्ट एक फ़ंक्शन के लिए एक संपत्ति क्यों बनाता है ? क्योंकि यह आपको बेवकूफ बनाने की कोशिश करता है, हाँ आपको बेवकूफ बनाता है कि यह वर्ग-आधारित भाषाओं की तरह काम करता है।
चलो हमारे उदाहरण के साथ चलते हैं और एक "ऑब्जेक्ट" बनाते हैं A:
var a1 = new A();
जब यह बात हुई तो पृष्ठभूमि में कुछ हो रहा है। a1एक साधारण चर है जिसे एक नई, खाली वस्तु सौंपी गई थी।
तथ्य यह है कि newएक फ़ंक्शन मंगलाचरण से पहले आपने ऑपरेटर का उपयोग किया A()था, पृष्ठभूमि में कुछ ADDITIONAL किया। newकीवर्ड एक नई वस्तु जो अब संदर्भ बनाया a1और उस वस्तु खाली है। यहाँ इसके अतिरिक्त क्या हो रहा है:
हमने कहा कि प्रत्येक फ़ंक्शन परिभाषा पर बनाई गई एक नई प्रॉपर्टी prototype(जिसे आप इसे एक्सेस कर सकते हैं, __proto__संपत्ति के विपरीत ) बनाई गई है? खैर, उस संपत्ति का इस्तेमाल अब किया जा रहा है।
तो अब हम उस बिंदु पर हैं जहाँ हमारे पास एक ताज़ा बेक्ड खाली a1वस्तु है। हमने कहा कि जावास्क्रिप्ट में सभी वस्तुओं में एक आंतरिक __proto__गुण होता है जो किसी चीज़ की ओर इशारा करता है ( a1यह भी है), चाहे वह शून्य हो या कोई अन्य वस्तु। newऑपरेटर क्या करता है यह उस __proto__संपत्ति को फ़ंक्शन की prototypeसंपत्ति को इंगित करने के लिए सेट करता है । उसे फिर से पढ़ें। यह मूल रूप से यह है:
a1.__proto__ = A.prototype;
हमने कहा कि A.prototypeएक खाली वस्तु से ज्यादा कुछ नहीं है (जब तक कि हम इसे परिभाषित करने से पहले किसी और चीज में नहीं बदलते a1)। तो अब मूल रूप a1.__proto__से उसी चीज़ की ओर A.prototypeइशारा करता है, जो कि खाली वस्तु है। वे दोनों उसी वस्तु की ओर संकेत करते हैं जो इस रेखा के बनने पर बनी थी:
A = function() {} // JS: cool. let's also create A.prototype pointing to empty {}
अब, जब var a1 = new A()वक्तव्य संसाधित होता है तो एक और बात होती है। मूल रूप A()से निष्पादित किया जाता है और यदि A कुछ इस तरह है:
var A = function() { this.hey = function() { alert('from A') } };
अंदर वह सब सामान function() { }निष्पादित करने जा रहा है। जब आप this.hey..लाइन पर पहुँचते हैं , तो thisइसे बदल दिया जाता है a1और आपको यह मिल जाता है:
a1.hey = function() { alert('from A') }
मैं कवर नहीं करूंगा कि thisबदलाव क्यों होता है a1लेकिन यह अधिक जानने के लिए एक शानदार उत्तर है।
इसलिए संक्षेप में, जब आप करते var a1 = new A()हैं तो पृष्ठभूमि में 3 चीजें हो रही हैं:
- एक पूरी तरह से नई खाली वस्तु बनाई और सौंपी गई है
a1।a1 = {}
a1.__proto__संपत्ति उसी बिंदु पर इंगित करने के लिए निर्दिष्ट की जाती A.prototypeहै (दूसरी खाली वस्तु {})
फ़ंक्शन A()को thisचरण 1 में बनाई गई नई, खाली ऑब्जेक्ट पर सेट के साथ निष्पादित किया जा रहा है (पढ़ें जवाब जो मैंने ऊपर संदर्भित किया है कि क्यों thisबदलता है a1)
अब, चलो एक और वस्तु बनाने की कोशिश करते हैं:
var a2 = new A();
चरण 1,2,3 दोहराएंगे। क्या आप कुछ नोटिस? मुख्य शब्द रिपीट है। चरण 1: a2एक नई खाली वस्तु होगी, चरण 2: इसकी __proto__संपत्ति एक ही बात को इंगित करेगी A.prototypeऔर सबसे महत्वपूर्ण बात, चरण 3: फ़ंक्शन A()फिर से निष्पादित होता है, जिसका अर्थ है कि एक फ़ंक्शन वाली संपत्ति a2प्राप्त होगी hey। a1और a2दो SEPARATE गुण हैं, heyजो 2 SEPARATE फ़ंक्शन का नाम देते हैं! अब हमारे पास एक ही काम करने वाले दो अलग-अलग ऑब्जेक्ट्स में डुप्लिकेट फ़ंक्शन हैं, उफ़ ... आप इस के मेमोरी निहितार्थों की कल्पना कर सकते हैं यदि हमारे पास 1000 ऑब्जेक्ट्स बनाए गए हैं new A, तो सभी फ़ंक्शंस घोषणाओं के बाद संख्या की तुलना में अधिक मेमोरी लेती हैं। 2. तो हम इसे कैसे रोकें?
याद रखें कि __proto__प्रत्येक वस्तु पर संपत्ति क्यों मौजूद है? ताकि यदि आप उस yoManसंपत्ति को पुनः प्राप्त करते हैं a1(जो मौजूद नहीं है), तो उसकी __proto__संपत्ति से परामर्श किया जाएगा, जो कि अगर यह एक वस्तु है (और यह सबसे अधिक मामले है), तो यह जांच करेगा कि क्या यह शामिल है yoMan, और यदि यह नहीं है यह उस वस्तु के __proto__आदि से परामर्श करेगा । यदि वह ऐसा करता है, तो वह उस संपत्ति का मूल्य लेगा और आपको प्रदर्शित करेगा।
तो किसी ने इस तथ्य + तथ्य का उपयोग करने का फैसला किया कि जब आप बनाते हैं a1, तो इसकी __proto__संपत्ति उसी (खाली) ऑब्जेक्ट को A.prototypeइंगित करती है और ऐसा करती है:
var A = function() {}
A.prototype.hey = function() { alert('from prototype') };
ठंडा! अब, जब आप बनाते हैं a1, यह फिर से ऊपर के सभी 3 चरणों से गुजरता है, और चरण 3 में, यह कुछ भी नहीं करता है, क्योंकि function A()निष्पादित करने के लिए कुछ भी नहीं है। और अगर हम करते हैं:
a1.hey
यह देखेगा कि a1इसमें शामिल नहीं है heyऔर यह देखने के लिए अपनी __proto__संपत्ति वस्तु की जांच करेगा कि क्या यह है, जो कि मामला है।
इस दृष्टिकोण के साथ हम चरण 3 से उस हिस्से को समाप्त करते हैं जहां प्रत्येक नए ऑब्जेक्ट निर्माण पर कार्यों को दोहराया जाता है। इसके बजाय a1और a2एक अलग होने heyसंपत्ति, अब उनमें से कोई भी यह है। जो, मुझे लगता है, तुम अब तक अपने आप को पता लगा। यह अच्छी बात है ... यदि आप समझते हैं __proto__और Function.prototype, इन जैसे प्रश्न बहुत स्पष्ट होंगे।
नोट: कुछ लोग आंतरिक प्रोटोटाइप संपत्ति को कॉल नहीं करते हैं __proto__, मैंने इस नाम को पोस्ट के माध्यम से Functional.prototypeदो अलग-अलग चीजों के रूप में संपत्ति में स्पष्ट रूप से अंतर करने के लिए उपयोग किया है।
