자바 스크립트 상속

Question

저는 현재 자바 스크립트 상속에 대한 몇 가지 접근 방식을 시도하고 있습니다.

이 (http://www.kevlindev.com/tutorials/javascript/inheritance/index.htm에서 '빌려') 내가 StreetGridView의 인스턴스를 만들 때

이제

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); 

, 나는 아무 문제 그것을() getOwnerElement를 호출 할 수 있습니다 : 나는 다음과 같은 코드가 있습니다. 모든 것이 예상대로 작동합니다.

그러나

내가 다른 인스턴스를 만들

은 예 2에 대한 변경 사항은 난이 공유 인스턴스 정보로 프로토 타입을 사용하여 주요 문제 알고 다시

1 인스턴스에 반영됩니다. 나는 오늘 아침에 내 머리를 짚어 봤지만 저를 올바른 방향으로 인도 할 수있는 누군가가 있는지 궁금해했습니다!

감사합니다.

Answer 1

영감을 얻으세요.

나는 그 패턴을 작동시키지 못했기 때문에, 무엇이 잘못되었는지 알아낼 수 있는지 알려 주시기 바랍니다. 하지만 주위에 물건을 이동하고 상속 조합을 사용하여, 나는 문제를 해결 한 것 같습니다.

다음 코드를 포함하고 다른 사람들을 돕기 위해이 게시물을 포럼에 남겼습니다.

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를 참조하십시오.
그들은 삶을 훨씬 쉽게 만듭니다.

Answer 3

the_drow는 :

나는 당신의 솔루션으로 두 번 슈퍼 생성자를 호출에 대한 위의 코멘트를 남겼 -하지만 inheritPrototype의 구현에 매달려 당신을 떠날 대해 조금 기분이 좋지. 이제 교체

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

: 우선,이 같은 니콜라스 Zakas에 신용이 날은 그의 책, 2 에드 웹 개발자를위한 전문 자바 스크립트 (181 페이지) 의역되어

StreetGridView.prototype = new GridView(); 

와

StreetGridView.prototype = inheritPrototype(StreetGridView,GridView); 

그리고 GridView 생성자를 한 번만 호출했습니다. 그러나 당신은 객체 메쏘드에 주목할 것입니다.

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

더글러스 크록 포드 (Douglas Crockford)를 읽은 적이 있다면 이걸 보셨을 것입니다!

뻔뻔 플러그 :이 물건 grok 수 어렵고 정확한 내가 TDD 자바 스크립트와 전체 두 번째 부분에 에세이를하고 있어요 이유 상속 패턴의 단위 테스트의 무리를 가지고있다. 저는 특별히 Zakas와 Crockford의 객체 생성과 상속에 관한 책을 검토하고 있습니다. 내 수필 (현재 Open Office .odt 형식)을 읽을 필요는 없지만 코드를 다운로드하고 2 분 안에 읽을 수있는 것보다 훨씬 더 많이 할 수 있습니다! My Free Book