骨幹視圖屬性：一個在實例上，一個在原型上？

我有一個看法。該視圖創建子視圖。這些子視圖存儲在一個數組中，以便我可以在某個時候刪除它們。

MN.ContactsView = MN.BaseView.extend ({ 

tagName : "div", 

contactViewItems : [], 

initialize : function(){   
    this.listenTo(MN.client.contacts, "add", this.addOne); 
    this.listenTo(MN.client.contacts, "reset", this.addAll); 
    this.listenTo(MN.client.contacts, "all", this.render);  
    MN.client.contacts.fetch(); 

}, render: function(){ 

}, 

addOne : function($contactModel){  
    var view = new MN.ContactsViewItem({model: $contactModel}); 
    this.contactViewItems.push(view); 
    $("#contactsContainer").append(view.render().el); 

}, 

addAll : function(){ 
    MN.client.contacts.each(this.addOne, this) 
}, 

close : function(){ 

}, 

destroy: function(){ 
    for(var i =0; i < this.contactViewItems.length; i++) this.contactViewItems[i].destroy(); 
    this.contactViewItems = []; 
    debugger; 
    console.log("Length: " + this.contactViewItems.length); 
    MN.BaseView.prototype.destroy.call(this); 
},

當我銷燬視圖並檢查調試器時，我看到相同的變量2次。什麼是主幹？

enter awesome image description here, dawg

來源

2013-07-02 nizzle

當您創建使用extend方法類，你給的屬性將被放在原型。這意味着，他們將被您班級的所有實例共享。如果在某些情況下您碰巧改變了該屬性的值，那麼您將會在shadow原型中使該屬性具有新值，而不再與原型鏈接。

所以，這裏是這裏發生了什麼：

當你修改contactViewItems與this.contactViewItems.push(view);，你不改變存儲在原型的價值。相反，您可以更改該值指向的對象。所以你仍然在修改一個數組，由你的類的所有實例共享。

但是，當你做this.contactViewItems = [];時，你真的在改變這個值，因爲你給它一個全新的對象。在那一刻，你只需shadow這個實例的類的原型尤其如此。原型當然還在那裏（你沒有做任何事情），所以你看到了兩次財產。

現在，它肯定不能按照你的要求工作，並且有幾種解決方案，我確信你現在可以想到，你知道問題的核心（我不知道你的細節應用程序，所以我沒有進一步的細節沒有多大的幫助）。

來源

2013-07-02 12:37:45 Loamhoof

當我銷燬視圖並檢查調試器時，我看到相同的變量2次。

因爲您在destroy函數創建它第二次在該實例：

this.contactViewItems = [];

如果你想清除你的原型數組，你應該已經使用，也可以

MN.ContactsView.prototype.contactViewItems = [];

或

this.contactViewItems.length = 0;

來源

2013-07-02 12:40:39 Bergi

Loamhoof指出，問題在於你的contactViewItems是你的ContactsViews原型的屬性。

一個簡單的方法來修改您的視圖，以便它可能以您可能期望的方式行事，是不要使contactViewItems與一個空數組一起使用。相反，在初始化中創建空數組。

例如：

MN.ContactsView = MN.BaseView.extend ({ 

tagName : "div", 

contactViewItems : null, 

initialize : function(){   
    this.contactViewItems = []; 
    this.listenTo(MN.client.contacts, "add", this.addOne); 
    this.listenTo(MN.client.contacts, "reset", this.addAll); 
    this.listenTo(MN.client.contacts, "all", this.render);  
    MN.client.contacts.fetch(); 
},

現在，將項目添加到這一點。contactViewItems直接在視圖對象上（這種情況下你可能想要的），而原型包含一個空值的contactViewItems。

來源

2013-10-28 20:40:24 dwhogg

骨幹視圖屬性：一個在實例上，一個在原型上？

回答

相關問題