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（）を呼び出すことはできません：私は、次のコードを持っています。すべてが期待どおりに機能します。

もつとも

Iの別のインスタンスを作成すると、インスタンス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：

私はあなたの溶液で2回スーパーコンストラクタを呼び出すについて上記のコメントを残した - しかし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版のWeb開発者のための専門のJavaScript（ページ181）を言い換えている

StreetGridView.prototype = new GridView(); 

、と

StreetGridView.prototype = inheritPrototype(StreetGridView,GridView); 

あなたはGridViewコンストラクタを1度だけ呼び出しました！しかし、あなたはオブジェクトメソッドに気付くでしょう。

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

ダグラス・クロフォードを読んだことがあれば、これを見たことがあります。

恥知らずプラグ：このようなものは、完全に理解するのは難しいと私はTDDのJavaScriptのエッセイをやってるし、全体の2番目の部分は遺伝パターンのユニットテストの束を持っている正確な理由です。私は特に、オブジェクトの作成と継承に関するZakasとCrockfordの書籍を調べています。あなたは私のエッセイを読む必要はありません（現在はOpen Office .odt形式です）。しかし、コードをダウンロードして2分で読むだけでは、もっと悪いことになるでしょう！ここにリンクです：ここに回答 My Free Book