プロトタイプ継承によるクラスの継承 ~ JavaScript によるオブジェクト指向プログラミング

この内容は少し詳細を含めて、新しく次のページに書き直しました。よかったら、そちらもご覧ください。 プロトタイプでオブジェクトの継承を実装する

JavaScript のクラス定義は、これまで見てきたように Java や C# など異なる方法での実装です。

クラスの継承も、実はいくつかやり方があります。

ここではプロトタイプ継承 (Prototypal Inheritance) と呼ばれる方法をご紹介します。

さっそく書き方です。

Student クラスを Person クラスから継承する場合、次のように書きます。 まず、基底クラスとなる Person クラスの定義。

function Person () {

}

次に、Student クラスを定義します。

function Student() {

}

そして、Person クラスを継承します。ここが今回のポイントです。


Student.prototype = new Person();

この書き方によって、 Student の prototype オブジェクトと Person の prototype オブジェクトがリンクされます。。 Student はメソッドを探すときに、自分のメソッドを探した後、それとリンクされたプロトタイプオブジェクトのメソッドを探します。 これによって、Student オブジェクトから Person のメソッドが呼べるようになります。

Student クラス特有のメソッドを定義するなら、この後にメソッドを定義すればよいのです。

Student.prototype.method1 = function () {

	// 何かする

}

では、実験用コードを示します。


//
// Person の定義
//

function Person(name) {
	this.name = name;
}

Person.prototype.sayHello = function() {
	alert( this.name );
}


//
// Person のテスト
//

var p1 = new Person('Ichiro Suzuki');

p1.sayHello();


//
// Student の定義
//

function Student(name) {
	this.name = name;
}


Student.prototype = new Person();

Student.prototype.sayBye = function() {
	alert( 'See you!' );
}


//
// Student のテスト
// 

var s1 = new Student('Hanako Yamada');

s1.sayHello(); 

// → 'Hanako Yamada' が表示される 
// (確かに Person のメソッドが使える)

s1.sayBye(); 

// → 'See you!' が表示される 
// (Student のメソッドも呼べる)

JavaScript によるオブジェクト指向プログラミング 目次 | >> Functional 継承によるクラスの継承

ここまでお読みいただき、誠にありがとうございます。SNS 等でこの記事をシェアしていただけますと、大変励みになります。どうぞよろしくお願いします。

© 2024 Web/DB プログラミング徹底解説