Наследование JavaScript

Question

Я пытаюсь несколько разных подходов к наследованию Javascript на данный момент. У меня есть следующий код:

('заимствованные' из http://www.kevlindev.com/tutorials/javascript/inheritance/index.htm)

KV = {}; 

KV.extend = function(subClass, baseClass) { 
     function inheritance() {} 
     inheritance.prototype = baseClass.prototype; 

     subClass.prototype = new inheritance(); 
     subClass.prototype.constructor = subClass; 
     subClass.baseConstructor = baseClass; 
     subClass.superClass = baseClass.prototype; 
    } 

function GridView() { 
     var _ownerElement; 
    } 

    GridView.prototype.getOwnerElement = function() { 

     return this._ownerElement; 
    } 

    GridView.prototype.setOwnerElement = function(ownerElement) { 
     this._ownerElement = ownerElement; 
    } 

    GridView.prototype.initialize = function() { 
     this.setOwnerElement('test'); 
    } 


function StreetGridView(dataURL, ownerElement) { 
     StreetGridView.baseConstructor.call(this); 

     StreetGridView.superClass.initialize(); 

     StreetGridView.superClass.setOwnerElement(ownerElement); 


} 

// subclass StreetGridView 
KV.extend(StreetGridView, GridView); 

Теперь, когда я создаю экземпляр StreetGridView, я не могу назвать getOwnerElement() на нем проблем нет. Все работает так, как ожидалось.

ОДНАКО

Когда я создаю еще один экземпляр, любые изменения, сделанные, например 2, отражается обратно в случае 1.

Я знаю, что это главная проблема с использованием прототипов в качестве информации экземпляра доли. Сегодня утром я ломаю себе голову, но задавался вопросом, есть ли там кто-то, кто мог бы указать мне в правильном направлении!

Thanks

Answer 1

Вдохновение ударяет!

Я не мог заставить этот шаблон работать, поэтому, пожалуйста, дайте мне знать, можете ли вы определить, что с ним не так. Но, перемещая вещи и используя комбинацию Inheritance, я, кажется, решил проблему.

Я включил следующий код и оставил это сообщение на форуме, чтобы помочь другим в будущем.

function GridView() { 
     var _ownerElement; 
    } 

    GridView.prototype.getOwnerElement = function() { 

     return this._ownerElement; 
    } 

    GridView.prototype.setOwnerElement = function(ownerElement) { 
     this._ownerElement = ownerElement; 
    } 

    GridView.prototype.initialize = function() { 
     this.setOwnerElement('test'); 
    } 

    function StreetGridView() { 

     GridView.call(this); 
    } 

    StreetGridView.prototype = new GridView(); 

    StreetGridView.prototype.initialize = function(dataURL, ownerElement) { 

     this.setOwnerElement(ownerElement); 


     /* Constructor Code */ 

     $(this.getOwnerElement()).flexigrid 
      (
       { 
        url: dataURL, 
        dataType: 'json', 
        colModel: [ 
        { display: '', name: 'view', width: 20, sortable: true, align: 'center' }, 
        { display: 'USRN', name: 'USRN', width: 80, sortable: true, align: 'center' }, 
        { display: 'Street', name: 'Street', width: 260, sortable: true, align: 'left' }, 
        { display: 'Locality', name: 'Locality', width: 200, sortable: true, align: 'left' }, 
        { display: 'Town', name: 'Town', width: 200, sortable: true, align: 'left' }, 
        { display: 'Open', name: 'Actions', width: 30, sortable: false, align: 'center' } 
        ], 
        sortname: "USRN", 
        sortorder: "asc", 
        usepager: true, 
        title: 'Streets', 
        useRp: true, 
        rp: 5, 
        showToggleBtn: false, 
        width: 'auto', 
        height: 'auto' 
       } 
      ); 
    } 

Answer 2

См here и here для информации :)
использовать также структуру, как прототип или Dojo.
Они делают жизнь намного проще.

Answer 3

the_drow:

Я оставил комментарий выше о вызове супер конструктор дважды с раствором - но чувствую себя немного плохо о оставив вас висит на реализацию inheritPrototype. В первую очередь, заслуга Николая Закаса как это я перефразирую его книгу Профессиональный JavaScript для веб-разработчиков, 2nd Ed (стр 181):

function inheritPrototype(sub,sup) { 
    var proto = object(sup.prototype);// you'll need an object create method ;) 
    proto.constructor = sub; 
    sub.prototype = proto; 
} 

Теперь замените ваш:

StreetGridView.prototype = new GridView(); 

с,

StreetGridView.prototype = inheritPrototype(StreetGridView,GridView); 

и вы только вызвали свой конструктор GridView один раз! Но вы заметите метод объекта. Вам понадобится что-то вроде:

function object(o) { 
    function F(){}; 
    F.prototype = o; 
    return new F(); 
} 

Если вы прочитали ни одного Дугласа Крокфорда, вы его видели!

Shameless Штекер:Этот материал трудно обращал внимания и точная причина, что я делаю сочинение на TDD JavaScript и всей второй части имеет кучу модульных тестов шаблонов наследования. Я специально изучаю книги Закаса и Крокфорда по созданию объектов и наследованию. Вам не нужно читать мое эссе (он в настоящее время находится в формате Open Office .odt), но вы можете сделать намного хуже, чем просто загрузить мой код и прочитать его за 2 минуты!Вот ссылка: My Free Book