2012-08-16 10 views
7

मैं मध्यम स्तर के जावास्क्रिप्ट डेवलपर हूं जो समझने की कोशिश कर रहा है कि रीढ़ की हड्डी लाइब्रेरी आंतरिक रूप से कैसे काम करती है और अगर कोई मुझे कुछ चुनौतियों का समाधान करने में मदद करता है तो गहराई से सराहना करेगा।रीढ़ की हड्डी वस्तु और वर्ग निर्माण पैटर्न

इसलिए यहाँ मैं क्या समझ रीढ़ में निर्माता समारोह के

मूल परिभाषा

Backbone.Model = function(attributes, options) { } 

तो वे सामान्य प्रयोजन का उपयोग हमारे निर्माता के प्रोटोटाइप में आम सुविधाओं को जोड़ने के विधि का विस्तार कर रहा है।

_.extend(Backbone.Model.prototype, Backbone.Events, {...}) 

अब इस हिस्से तक मुझे पता है कि वास्तव में क्या हो रहा है और निम्नलिखित हालांकि कोड

var user = new Backbone.Model() 

नई वस्तु का दृष्टांत देने में खुशी होगी और इस हिस्से मैं चुनौतीपूर्ण

लग रहा है क्योंकि यह बैकबोन में किसी ऑब्जेक्ट को तुरंत चालू करने का तरीका नहीं है, लेकिन हम विस्तार विधि

var Users = Backbone.Model.extend({}); 
var user = new Users() 
012 का उपयोग करते हैं

और रीढ़ की हड्डी कोड में

Backbone.Model.extend = extend; 

var extend = function(protoProps, classProps) { 
     var child = inherits(this, protoProps, classProps); 
     child.extend = this.extend; 
     return child; 
}; 

var inherits = function(parent, protoProps, staticProps) { 
    var child; 
    if (protoProps && protoProps.hasOwnProperty('constructor')) { 
     child = protoProps.constructor; 
    } else { 
     child = function() { 
      return parent.apply(this, arguments); 
     }; 
    } 
    _.extend(child, parent); 
    ctor.prototype = parent.prototype; 
    child.prototype = new ctor(); 
    if (protoProps) _.extend(child.prototype, protoProps); 
    if (staticProps) _.extend(child, staticProps); 
    child.prototype.constructor = child; 
    child.__super__ = parent.prototype; 
    return child; 
}; 

कृपया मुझे समझाने अंदर क्या हो रहा है समारोह के वारिस और क्या विधि दृष्टिकोण का विस्तार के लाभ

+0

बैकबोन टिप्पणी के साथ स्रोत है: http://documentcloud.github.com/backbone/docs/backbone.html inherits विधि के लिए खोजें। उनके पास एक अच्छा विवरण है। अद्भुत विवरण के लिए – jForrest

उत्तर

10

अंडरस्कोर के extend समारोह दूसरे से सदस्य (कार्य करता है और गुण) विलीन हो जाती है है पहले में तर्क। उदाहरण के लिए:

var reciever = { 
    name: "Jonny", 
    age: 29 
}; 

var supplier: { 
    languages: [ "javascript", "actionscript" ]; 
    sayHi: function() { 
     console.log("Hi, name name is " + this.name); 
    } 
}; 

_.extend(receiver, supplier); 

उपरोक्त कोड को क्रियान्वित करने के बाद, रिसीवर वस्तु संवर्धित किया गया होगा (संशोधित) और अब इस तरह दिखना:

/* 
    { 
     age: 29, 
     languages: [ "javascript", "actionscript" ], 
     name: "Jonny", 
     sayHi: <<function>> 
    } 
*/ 
console.dir(receiver); 

ध्यान दें कि आपूर्तिकर्ता वस्तु असंशोधित बनी हुई है और रिसीवर वस्तु सप्लायर से सभी गुणों और कार्यों को प्राप्त करता है। इस प्रक्रिया को आमतौर पर mixin के रूप में जाना जाता है और कार्यों का पुनर्विक्रय करने से बचने के लिए इसका उपयोग किया जाता है (व्यापक प्रोग्रामिंग सिद्धांत के हिस्से के रूप में DRY - Don't Repeat Yourself पता है)।

अब रीढ़ की Model.extend समारोह के लिए के रूप में, यह एक factory method रूप में कार्य करता आप एक निर्माता समारोह जो आंतरिक inherits काम के थोक कर समारोह के साथ अपने मॉडल का नया उदाहरण बना करने के लिए इस्तेमाल किया जा सकता वापस जाने के लिए। inherits फ़ंक्शन मिश्रित अवधारणा को एक कदम आगे ले जाता है जो आपूर्ति की गई वस्तु और माता-पिता के बीच inheritance chain बनाता है (इस विशेष मामले में, Backbone.Model ऑब्जेक्ट)।

var child; 
if (protoProps && protoProps.hasOwnProperty('constructor')) { 
    child = protoProps.constructor; 
} else { 
    child = function() { 
     return parent.apply(this, arguments); 
    }; 
} 

कोड का यह पहला ब्लॉक आपूर्ति किए गए ऑब्जेक्ट हैश के अंदर एक कन्स्ट्रक्टर फ़ंक्शन खोजने का प्रयास कर रहा है; यदि कोई उपस्थित नहीं है तो यह आपके लिए एक नया कन्स्ट्रक्टर फ़ंक्शन बनाता है जो स्वचालित रूप से आपूर्ति किए गए तर्कों को Backbone.Model के अपने constructor function पर पास करता है।

_.extend(child, parent); 

अगला हम रेखांकित के निर्माता समारोह में गुण और कार्यों का आपूर्ति हैश से सभी गुण और कार्य Mixin के लिए विधि का विस्तार कहते हैं; यह सुनिश्चित करता है कि आपके द्वारा बनाए गए प्रत्येक उदाहरण में इसका अपना डेटा है (उदाहरण: गुण स्थिर नहीं हैं और आपके द्वारा बनाए गए सभी उदाहरणों में साझा किए जाते हैं)।

ctor.prototype = parent.prototype; 
child.prototype = new ctor(); 
if (protoProps) _.extend(child.prototype, protoProps); 
if (staticProps) _.extend(child, staticProps); 
child.prototype.constructor = child; 
child.__super__ = parent.prototype; 

इस अंतिम ब्लॉक सबसे रोमांचक है और हाल में बनाई गई निर्माता समारोह के प्रोटोटाइप और माता पिता (Backbone.Model) वस्तु के प्रोटोटाइप के बीच एक संबंध बनाता है। ऐसा करके, कन्स्ट्रक्टर द्वारा लौटाए गए सभी नए उदाहरणों में सामान्य रीढ़ की हड्डी मॉडल विधियों (यानी: get और set) शामिल होंगे क्योंकि उन्हें प्रोटोटाइप श्रृंखला से हल किया गया है। यदि आप कोड के इस विशेष ब्लॉक के बारे में अधिक जानना चाहते हैं, तो Douglas Crockford's article on Prototypal inheritance शुरू करने के लिए एक शानदार जगह है।

इस दृष्टिकोण का मुद्दा यह है कि यह आप के गुण और समारोह जो जिसके परिणामस्वरूप निर्माता समारोह एक खाका के रूप में इस्तेमाल करेगा के हैश की आपूर्ति, उदाहरण के लिए देता है:

var Person = Backbone.Model.extend({ 
    name: "Jon Doe", 
    sayHi: function() { 
     console.log("Hi, my name is " + this.get("name")); 
    } 
}); 

अब प्रत्येक Person वस्तु आप का दृष्टांत होगा दोनों एक name संपत्ति और एक sayHi समारोह, जैसे:

var dave = new Person(); 
dave.sayHi(); // "Hi, my name is Jon Doe" 

dave.set("name", "Dave"); 
dave.sayHi(); // "Hi, my name is Dave" 

// You can also supply properties when invoking the constructor. 
var jimmy = new Person({ name: "Jimmy" }); 
jimmy.sayHi(); // "Hi, my name is Jimmy" 
+0

धन्यवाद, हालांकि मैं अभी भी काफी कोड के इस खंड के साथ उलझन में हूँ 'अगर (protoProps && protoProps.hasOwnProperty ('निर्माता')) { बच्चे = protoProps.constructor; } ' यह हमेशा ऑब्जेक्ट नहीं है और इसका उपयोग करने का क्या मतलब है। 'else { बच्चे = फ़ंक्शन() { वापसी माता-पिता। (यह, तर्क); }; } ' और कोड के इस खंड (, माता पिता, protoProps staticProps) Backbone.Model लौटने रूप में ही है जो फिर से भ्रामक रूप में तर्क वस्तु माता पिता पैरामीटर होगा क्या का उपयोग करने में नुकसान सिर्फ ' बच्चे = function() {} ' –

+0

यदि परिभाषित रीढ़ की हड्डी आपके कन्स्ट्रक्टर फ़ंक्शन का उपयोग करेगी। अन्यथा यह बैकबोन के मॉडल कन्स्ट्रक्टर का उपयोग करेगा। इस कन्स्ट्रक्टर को वस्तु के लिए तर्कों को जानने की भी आवश्यकता है। इसलिए आपको माता-पिता कन्स्ट्रक्टर को parent.apply विधि से कॉल करने की आवश्यकता है। –

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