2010-01-27 15 views
24

में भ्रामक दुविधापूर्ण की जावास्क्रिप्ट एक साथ कार्य करना है, जब इससहायता, "इस" मुझे जावास्क्रिप्ट

var x = { 
    ele : 'test', 
    init : function(){ 
    alert(this.ele); 
    } 
} 

का उपयोग कर फिर भी जब कई वस्तु और विशेष रूप से घटनाओं this परिवर्तन और हो जाता है के संदर्भ के साथ काम ट्रैक/समझ रखने के लिए भ्रमित।

तो अगर किसी के पास बेहतर इनपुट/दिशानिर्देश/विचार/बेहतर प्रथाएं हैं, तो कृपया साझा करें। मैं यह भी जानना चाहूंगा कि this का उपयोग करने से कोई (प्रदर्शन) लाभ मिलता है या क्या?

+8

यह सिर्फ आप नहीं है - यह भाषा के अधिक भ्रमित पहलुओं में से एक है। आपको कुछ अच्छे जवाब मिलना चाहिए; मैं उन्हें पढ़ने के लिए तत्पर हूं। –

उत्तर

27

यह प्रदर्शन के बारे में नहीं है यह एक वस्तु का एक विशिष्ट उदाहरण के एक संपत्ति पहुँचने के बारे में बताया गया है: -

x.init() 

अगर आप समारोह में this का उपयोग नहीं किया था 'परीक्षण' का प्रदर्शन नहीं करेगा।

प्रभावी ढंग से ऊपर पंक्ति के रूप में एक ही है: -

x.init.call(x); 

call का उपयोग, जब समारोह निष्पादित किया जाता है this को सौंपा गया है में पहली परमाटर।

अब विचार करें: -

var fn = x.init; //Note no() so the function itself is assigned to the variable fn 
fn(); 

अब आप चेतावनी में कुछ भी नहीं मिलता है। इसका कारण यह है ऊपर प्रभावी रूप से है: -

fn.call(window); 

ब्राउज़र में जावास्क्रिप्ट का आयोजन किया window वस्तु वैश्विक वस्तु का पर्याय है। जब किसी फ़ंक्शन को "कच्चे में" कहा जाता है तो this वैश्विक ऑब्जेक्ट पर डिफ़ॉल्ट होता है।

क्लासिक त्रुटि कुछ इस तरह कर रही है: -:

onclick.call(theDOMElement) 
-

var x = { 
    ele: 'test'; 
    init: function(elem) { 
     elem.onclick = function() { alert(this.ele); } 
    } 
} 
x.init(document.getElementById('myButton')); 

हालांकि इस वजह onclick घटना से जुड़ी समारोह की तरह कोड का उपयोग ब्राउज़र द्वारा कहा जाता है काम नहीं करता है

इसलिए जब फ़ंक्शन चल रहा है this ऐसा नहीं है जो आपको लगता है।

मेरे इस स्थिति के लिए हमेशा की तरह समाधान है: -

var x = { 
    ele: 'test'; 
    init: function(elem) { 
     var self = this; 
     elem.onclick = function() { alert(self.ele); } 
     elem = null; 
    } 
} 
x.init(document.getElementById('myButton')); 

नोट elem = null आईई स्मृति रिसाव है काम के आसपास।

+0

मुझे लगता है कि x.init() नहीं होना चाहिए e.init() लेकिन संपादन <6 वर्ण है इसलिए मैं इसे सबमिट नहीं कर सकता। –

6

यह बहुत भ्रमित है। यह इस बात पर निर्भर करता है कि आप फ़ंक्शन को कैसे कॉल करते हैं। डौग क्रॉकफोर्ड ने अपनी पुस्तक Javascript, the Good Parts में एक अच्छा लेखन किया था। इसका अर्थ this excellent answer में अन्यथा बुरी तरह से तैयार किए गए प्रश्न में है।

और नहीं, यह प्रदर्शन के बारे में नहीं है।

2

this कीवर्ड पर एक अच्छा और प्रबुद्ध लेख this (कोई भी इरादा नहीं है)। लेख आपके लिए चीजों को साफ़ कर सकता है, मुझे पता है कि यह मेरे लिए किया गया था।

आवश्यक नियम है कि this कीवर्ड एक समारोह के अंदर हमेशा समारोह मालिक को संदर्भित करता है, और परिणाम को समझने के लिए महत्वपूर्ण समझने जाता है जब कार्यों कहा जाता है और जब वे कर रहे की नकल की है। उदाहरणों के लिए पूर्ववर्ती आलेख देखें।

1

उपयोग

var me = this; 

function(){ 

के बाहर तो आप समारोह()

3

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

संबंधित मुद्दे