クラスを継承する

スポンサーリンク

JavaScriptでクラスを継承する場合は、 親クラスのインスタンスを子クラスのprototypeプロパティにセットします。

子クラス.prototype = new 親クラス()

コード例

下の表のように、親クラスCard、子クラスChildCard、 それぞれの独自メソッドがgetNumber()、showNumber()であるクラスを作成、継承してみます。

クラス名メソッド
親クラスCardgetNumber()
子クラスChildCardshowNumber()

// Card クラス
function Card(num){
    this.number = num;
}
// メソッド
Card.prototype.getNumber = function(){
    return this.number;
}

// ChildCard クラス
function ChildCard(num){
    this.number = num;
}

// 継承
ChildCard.prototype = new Card();

// メソッド
ChildCard.prototype.showNumber = function(){
    console.log(this.number);
}


var c = new ChildCard(5);
console.log(c.getNumber());  // 5
c.showNumber();              // 5

ポイントは赤字部分です。親クラスCardのインスタンスを 子クラスChildCardのprototypeプロパティにセットしています。 これによりクラスが継承されます。

// 継承
ChildCard.prototype = new Card();
下の3行で、子クラスのインスタンスから親クラスのメソッドgetNumber()と、 子クラスのメソッドshowNumber()が呼び出されていることが確認できます。
var c = new ChildCard(5);
console.log(c.getNumber());  // 5
c.showNumber();              // 5

ツール・書籍紹介

まとめ・一覧

基本編

数値

文字列

正規表現

日付・時刻

配列

関数

オブジェクト指向

DOM操作

API

便利な小技集

用語

実践編

関連サイト