2011-05-25 12 views
5

मॉर्निन 'सब।jQuery के लिए प्रोटोटाइप कोड (बाइंड (यह) बनाम बंद)

मैं एक JQuery प्लगइन करने के लिए एक प्रोटोटाइप कोड पुनर्लेखन कर रहा हूँ और कैसे इस टुकड़े को संभालने के लिए पता नहीं है:

this.observers = events.map(function(name) { 
    var handler = this["on" + name.].bind(this); 
    this.element.observe(name, handler); 
    return { name: name, handler: handler }; 
}.bind(this)); 

मैं के साथ समाप्त हो गया:

this.observers = $.each(events , function(i, name) { 
    var handler = "on"+name; 
    $element.live({ 
     name: handler 
    }); 
} 

मैं पूरी तरह गलत हूँ ? मैं अच्छी तरह से प्रोटोटाइप बांध() उद्देश्य समझ में नहीं आता है।

मदद के लिए धन्यवाद!

संपादित करें: कि के संदर्भ एक प्लगइन init() फ़ंक्शन मैं कहाँ देते हैं "गतिशील" घटनाओं और उनके हैंडलर निजी तरीकों के रूप में कोडित ...

plugin.init = function() { 

    // the plugin's final properties are the merged default and user-provided options (if any) 
    plugin.settings = $.extend({}, defaults, options); 

if (!plugin.observers) { 
    var events = ("mouseover mouseout").split(" "); 

    plugin.observers = $.map(events, $.proxy(function(name) { 
     var handler = $.proxy(this['on' + name], this); 
     $element.bind(name, handler); 
     return { name: name, handler: handler }; 
    }, this)); 

} 
console.log(plugin.observers); 
} 
+0

प्रोटोटाइप का फ़ंक्शन.बिंड() jQuery.proxy() के अनुरूप है, दोनों बारीकी से ECMAScript 5 Function.bind() से मेल खाते हैं लेकिन अंतर फ़ंक्शन हस्ताक्षर में है। बांध का उद्देश्य एक समारोह को वापस करना है जहां यह 'एक विशिष्ट वस्तु से जुड़ा हुआ है। – gonchuki

उत्तर

1
प्रोटोटाइप करने के लिए jQuery अनुवाद के लिए के रूप में

है (बाँध/प्रॉक्सी पहले पर मेरे ऊपर व्याख्या पढ़ना), इस बारीकी से ऊपर टुकड़ा मैच चाहिए:

this.observers = $.map(events, $.proxy(function(name) { 
    var handler = $.proxy(this['on' + name], this); 
    this.element.bind(name, handler); 
    return { name: name, handler: handler }; 
}, this)); 

मैं प्रोटोटाइप से संभालने हूँ स्निपेट को:

  • this प्रोटोटाइप क्लास या एक सादा जेएस ऑब्जेक्ट है जो वर्तमान संदर्भ है।
  • this.element एक डोम तत्व का संदर्भ है, और jQuery मामले में एक jQuery-wrapped DOM तत्व है।
  • onclick, onfocus और इसी तरह के संभावित कॉलबैक this संदर्भ में विधियां हैं।

आपके कोड कैसे काम करता है या प्रोटोटाइप प्लगइन का कौन सा टुकड़ा आप इसे फिर से लिखने की कोशिश कर रहे हैं, इस बारे में और संदर्भ के बिना जितना मैं आपकी मदद कर सकता हूं (जो मुझे उम्मीद है)।

+0

इस स्निपेट के लिए धन्यवाद ... इसे खाने की ज़रूरत है! मैं सबकुछ समझ नहीं पा रहा हूं ... इसे कॉल करने के बाद, console.log (this.observers) एक सरणी देता है (जिसे मैंने प्रोटोटाइप मानचित्र के बराबर देखने के लिए याद किया), लेकिन हैंडलर "अपरिभाषित" –

+0

btw @ gonchuki, आपकी धारणाओं के बारे में, कृपया मेरे दूसरे EDIT को ऊपर देखें;) –

+0

और आप सुनिश्चित हैं कि 'init' फ़ंक्शन को होस्ट करने वाली वही ऑब्जेक्ट में' onmouseover' और 'onmouseout' भी है? मूल प्रोटोटाइप कोड पर कॉलबैक के नामकरण पर यह एक मुश्किल हिस्सा है। – gonchuki

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