JavaScript/オブジェクト指向構文/オブジェクトの継承１ - プログラミングの勉強をしよう@Wiki

Top > JavaScript > オブジェクト指向構文 > オブジェクトの継承１

オブジェクトの継承１

概要

オブジェクトを継承して、自身のメソッドとは別に継承元のメソッド
は使用できる

※この方法ではプロパティの継承などは行えない

定義

// ベースオブジェクト定義
var ベースオブジェクト = function(){
    // コンストラクタ処理
};
 
// オブジェクトリテラルでプロトタイプを定義
ベースオブジェクト.prototype ={
    // メソッド処理
};
 
// ベースオブジェクト定義
var オブジェクト = function(){
    // コンストラクタ処理
}
 
// 継承元のオブジェクトを設定
オブジェクト.prototype = new ベースオブジェクト();
 

サンプル

ソース

// ベースオブジェクト定義
var MyBaseClass = function(name){
    this.name = name;
};
 
// オブジェクトリテラルでプロトタイプを定義
MyBaseClass.prototype ={
    getData01 : function(){
                    return 'name  = ' + this.name + '<br />';
                },
    getData02 : function(label){
                    return 'label = ' + label + '<br />';
                },
};
 
// ベースオブジェクト定義
var MyClass = function(name){
    this.data2 = name;
}
 
// 継承元のオブジェクトを設定
MyClass.prototype = new MyBaseClass(name);
 
// 継承されたオブジェクトにメソッドを追加する場合は個別に設定する
MyClass.prototype.getData03 = function(label){
    return 'label2 = ' + label + ' name = '+ this.data2 + '<br />';
};
 
// オブジェクトのインスタンスを生成して実行
var obj1 = new MyClass('User01');
 
// MyBaseClassのメソッド結果
document.writeln(obj1.getData01());
document.writeln('<br />');
 
// MyBaseClassのメソッド結果
document.writeln(obj1.getData02('Local User'));
document.writeln('<br />');
 
// MyClassのメソッド結果
document.writeln(obj1.getData03('Local Sample'));
document.writeln('<br />');
 
 

結果

name =
 
label = Local User
 
label2 = Local Sample name = User01
 
 

---