2012-08-27 15 views
5

ठीक है! सबसे पहले यह सवाल एक ऐसे व्यक्ति से आता है जो jQuery ब्रह्मांड में बहुत गहरा खो देता है (और सकारात्मक रूप से खो जाता है)।मूल्य, प्रोटोटाइप और संपत्ति का अंतर

मेरी reserch में मुझे पता चला jQuery के मुख्य पैटर्न कुछ इस तरह (जरूरत सुधार wellcomed जाता है तो) है:

(function (window, undefined) { 

    jQuery = function (arg) { 
     // The jQuery object is actually just the init constructor 'enhanced' 
     return new jQuery.fn.init(arg); 
    }, 
    jQuery.fn = jQuery.prototype = { 
     constructor: jQuery, 
     init: function (selector, context, rootjQuery) { 
     // get the selected DOM el. 
     // and returns an array 
     }, 
     method: function() { 
     doSomeThing(); 
     return this; 
     }, 
     method2: function() { 
     doSomeThing(); 
     return this;, 
     method3: function() { 
      doSomeThing(); 
      return this; 
     }; 

     jQuery.fn.init.prototype = jQuery.fn; 

     jQuery.extend = jQuery.fn.extend = function() { 

      //defines the extend method 
     }; 
     // extends the jQuery function and adds some static methods 
     jQuery.extend({ 
      method: function() {} 

     }) 

     }) 

$jQuery.prototype.init शुरू शुरू की और तत्वों की एक सरणी देता है। लेकिन मुझे समझ में नहीं आया कि यह jQuery विधि जैसे .css या .hide इत्यादि को कैसे जोड़ता है। इस सरणी के लिए।

मुझे स्थिर तरीके मिलते हैं। लेकिन यह उन सभी विधियों के साथ तत्वों की वापसी और सरणी कैसे प्राप्त नहीं हो सका।

+0

@adnan thanx – Lupus

उत्तर

8

मुझे यह पैटर्न पसंद नहीं है। वे एक init समारोह है, जो सभी jQuery उदाहरणों में से निर्माता है - jQuery समारोह अपने आप में सिर्फ new साथ उस वस्तु निर्माण के चारों ओर एक आवरण है:

function jQuery(…) { return new init(…); } 

फिर, वे init.prototype वस्तु को ऐसे मामलों की विधियों को जोड़ने । इस ऑब्जेक्ट को jQuery.fn पर एक इंटरफ़ेस के रूप में उजागर किया गया है। साथ ही, वे उस क्रिया के लिए jQuery फ़ंक्शन की prototype प्रॉपर्टी सेट करते हैं - उन लोगों के लिए जो fn संपत्ति का उपयोग नहीं करते हैं। अब आपके पास

jQuery.prototype = jQuery.fn = […]init.prototype 

लेकिन वे भी दो [अजीब] कार्य:,

  • प्रोटोटाइप वस्तु की constructor संपत्ति को अधिलेखित jQuery समारोह
  • jQuery.fn पर init समारोह को उजागर करने के लिए स्थापित - इसका अपना प्रोटोटाइप। यह Extending $.fn.init function अनुमति दे सकते हैं, लेकिन बहुत भ्रामक

मुझे लगता है कि वे जरूरत है/मूर्ख प्रूफ होने के लिए यह सब करना चाहते हैं, लेकिन उनके कोड एक गड़बड़ है - बाद में उस वस्तु शाब्दिक के साथ शुरू और init प्रोटोटाइप बातें बताए ।

+1

+1 इस पैटर्न को तुच्छ मानने के लिए – Adi

+0

कन्स्ट्रक्टर को ओवर-राइट करना है कि उन्हें 'यह' कैसे मिलता है, यानी jQuery को इंगित करने के लिए वापस लौटाया गया मूल्य ... ... यह नहीं है कि # 2 अजीब चीज है ... # 1 अजीब बात क्या है के लिये? –

+0

यह अनिवार्य रूप से एक 'हैक' की तरह दिखने के लिए एक हैक 'jQuery' यह ' –

3

यदि आप एपीआई के तरीकों के बाहरी संग्रह के रूप में सोचते हैं, और jQuery फ़ंक्शन रैपर के रूप में सोचते हैं तो पचाना आसान है।

यह मूल रूप से इस तरह का निर्माण किया है:

function a() { return new b();} 
a.prototype.method = function() { return this; } 
function b() {} 
b.prototype = a.prototype; 

कि a छोड़कर jQuery और bjQuery.prototype.init है।

मुझे यकीन है कि रेजिग में एनी कन्स्ट्रक्टर को इनिट प्रोटोटाइप में रखने के उनके कारण थे, लेकिन मैं उन्हें नहीं देख सकता।इसके अलावा लोगों को Bergi अधिक विचित्रता के एक जोड़े का उल्लेख किया:

var $body = new $.fn.init.prototype.init.prototype.init.prototype.init('body'); 

2) हर jQuery संग्रह वास्तव में एक है:

1) पैटर्न jQuery.fn.init.prototype से jQuery.prototype के लिए एक संदर्भ की नकल की आवश्यकता है, जो एक अजीब अंतहीन लूप की अनुमति देता है jQuery.fn.init का उदाहरण, लेकिन चूंकि वे एक ही प्रोटोटाइप ऑब्जेक्ट का संदर्भ देते हैं, इसलिए यह हमें "सोचने" के लिए प्रेरित करता है कि संग्रह jQuery का उदाहरण है। आप इस तरह एक ही टोना कर सकते हैं:

function a(){} 
function b(){} 
a.prototype = b.prototype; 
console.log(new b instanceof a); // true 
console.log(new a instanceof b); // true 

Sidenote: मैं व्यक्तिगत रूप से weirdness के बिना इसी तरह के परिणाम के साथ निम्न निर्माता पैटर्न का इस्तेमाल किया है: संपादित करें के लिए

var a = function(arg) { 
    if (!(this instanceof a)) { 
     return new a(arg); 
    } 
}; 
a.prototype.method = function(){ return this; }; 
संबंधित मुद्दे