2010-03-07 7 views
11

मैं jQuery के लिए प्लगइन लिखने में जा रहा हूं और मैं $ .f और $ .fn.f

के बीच भेद को समझने की कोशिश कर रहा हूं मैंने प्लगइन लेखकों को दोनों का उपयोग किया है, या कभी-कभी $ .f = $ .fn.f

किसी ने मुझे इस व्याख्या कर सकते हैं, तर्क, लाभ, आदि?

उत्तर

13

jQuery स्रोत कोड को देखते हुए चीजों को साफ हो जाएगा। वैसे, jQuery और $ एक ही वस्तु का उल्लेख है, और यह कैसे jQuery वस्तु परिभाषित किया जाता है:

var jQuery = function(selector, context) { 
    return new jQuery.fn.init(selector, context); 
} 

jQuery एक समारोह है और जावास्क्रिप्ट में एक समारोह भी प्रकार Function का एक उद्देश्य है। तो jQuery.f या $.f jQuery Function वस्तु को f देता है, या यह jQuery वर्ग फोन करता है, तो आप करेंगे।

अगर आप jQuery के स्रोत पर नज़र डालें तो,, देखेंगे कि jQuery.prototypejQuery.fn

jQuery.fn = jQuery.prototype 

तो करने के लिए सौंपा गया है जब भी आप jQuery.fn के लिए एक विधि (या संपत्ति) देते हैं, jQuery.fn.f = .., या $.fn.f = .. में के रूप में या jQuery.prototype.f = .., या $.prototype.f = .., यह विधि इस jQuery वर्ग के सभी उदाहरणों के लिए उपलब्ध होगी (फिर, जावास्क्रिप्ट में कोई कक्षा नहीं है, लेकिन यह समझने में मदद कर सकती है)।

जब भी आप jQuery() समारोह आह्वान, jQuery("#someID") में के रूप में, एक नया jQuery उदाहरण इस लाइन पर बनाई गई है:

return new jQuery.fn.init(selector, context); 

और इस उदाहरण सभी तरीकों हम प्रोटोटाइप से जुड़ी है, लेकिन नहीं है कि तरीकों सीधे Function ऑब्जेक्ट से जुड़े हुए थे।

आप अगर आप एक समारोह है कि सही जगह पर परिभाषित नहीं किया गया था बुला की कोशिश एक अपवाद मिल जाएगा।

$.doNothing = function() { 
    // oh noez, i do nuttin 
} 

// does exactly as advertised, nothing  
$.doNothing(); 

var jQueryEnhancedObjectOnSteroids = $("body"); 
// Uncaught TypeError: Object #<an Object> has no method 'doNothing' 
jQueryEnhancedObjectOnSteroids.doNothing(); 

ओह, और अंत में एक लंबे धागे कम कटौती करने के लिए और अपने सवाल का जवाब देने - $.f = $.fn.f कर आप एक प्लगइन या एक उपयोगिता विधि (jQuery शब्दावली में) के रूप में समारोह का उपयोग करने के लिए अनुमति देता है।

4

$.f जबकि $.fn.f एक jQuery प्लगइन/विधि है एक उपयोगिता कार्य है।

एक उपयोगिता फ़ंक्शन मूल रूप से jQuery नामस्थान के भीतर एक फ़ंक्शन है जो कुछ ऑपरेशन करने के लिए उपयोगी है, उदाहरण के लिए, $.isArray(obj) जांच करता है कि कोई ऑब्जेक्ट obj एक सरणी है। यदि आप अक्सर उनका उपयोग करेंगे और ग्लोबल नेमस्पेस प्रदूषण से बचने के लिए भी jQuery नामस्थान में फ़ंक्शंस डालना उपयोगी है।

दूसरी तरफ jQuery विधियां jQuery ऑब्जेक्ट्स/लिपटे सेट पर काम करती हैं। उदाहरण के लिए, $(document.body).append('<p>Hello</p>'); दस्तावेज़ के बॉडी तत्व को हैलो युक्त अनुच्छेद जोड़ देगा। $.fn jQuery के बाद के संस्करणों में $.prototype के लिए एक शॉर्टेंड है (यह हमेशा लाइब्रेरी के पुराने संस्करणों में नहीं था)। आप अपने स्वयं के प्लगइन लिखते समय इसका इस्तेमाल करेंगे।

+0

तो $ .f = $ .fn.f का लाभ क्या है? – qodeninja

+0

आपका क्या मतलब है, लाभ क्या है? वे विभिन्न उद्देश्यों की सेवा करते हैं। क्या आप कह सकते हैं कि आपने '$ .f = $ .fn.f' का उपयोग करके प्लगइन लेखकों को कहां देखा है? –

+0

SimpleModal यह http://www.ericmmartin.com/projects/simplemodal/ – qodeninja

4

$.fn.f बस jQuery.prototype

के लिए एक शॉर्टकट fn का उपयोग करके है, तो आप विधि का विस्तार का उपयोग किए बिना प्लगइन तरीकों जोड़ सकते हैं:

jQuery.fn.myPlugin = function(opts) { ... } 
संबंधित मुद्दे