ES6で追加されたclass構文により、JavaScriptでもクラスベースの記法でオブジェクト指向プログラミングが可能になりました。従来はプロトタイプ継承を用いてオブジェクトの雛形を作っていましたが、class構文はこれを抽象化し、他の言語に近い記法でコンストラクタやメソッド、継承(extends)を記述できます。
JavaScriptのクラスはシンタックスシュガーであり、内部的にはプロトタイプチェーンを利用した仕組みです。しかし開発者はclass Foo { ... }と書くだけでクラスを定義でき、new Foo()でインスタンスを生成できます。クラスにはコンストラクタconstructorメソッドや、プロトタイプメソッド(クラス内に定義したメソッド)が含まれます。さらにextendsキーワードでクラスを継承し、super呼び出しで親クラスのコンストラクタやメソッドを呼ぶことができます。
JavaScriptにおけるクラスと継承の例を示します。Personクラスを定義し、それを継承したStudentクラスを作成します。
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
greet() {
console.log(`こんにちは、${this.name}です。`);
}
// Personクラスを継承したStudentクラス
class Student extends Person {
constructor(name, age, grade) {
super(name, age); // 親クラスのコンストラクタを呼び出し
this.grade = grade;
}
}
study() {
console.log(`${this.name}は勉強しています。`);
}
const alice = new Person("Alice", 30);
alice.greet(); // "こんにちは、Aliceです。"
const bob = new Student("Bob", 20, "A");
bob.greet(); // "こんにちは、Bobです。" (親クラスのメソッドを利用)
bob.study(); // "Bobは勉強しています。"
解説:
上記のPersonクラスは、constructorで名前と年齢を受け取りプロパティname,
ageに代入しています。greet()メソッドはインスタンスのnameを使って挨拶を表示する機能です。StudentクラスはPersonをextendsしており、新たにgrade(成績や学年などを表す)プロパティとstudy()メソッドを追加しています。Studentのコンストラクタではsuper(name, age)を呼び出して親Personの初期化を行った後、自身のgradeをセットしています。
生成したbob(Studentインスタンス)は、Personから継承したgreet()メソッドと、自身で持つstudy()メソッドの両方が利用可能です。このように、クラス構文を使うことで継承関係を簡潔に表現でき、オブジェクト指向のパターン(継承による機能拡張など)をJavaScriptで実践しやすくなります。
TypeScript版では各プロパティやメソッドに型情報を付与しています。たとえばname: string;と宣言することでnameプロパティは文字列型であることが明示され、誤った型の値を代入しようとするとコンパイルエラーになります。クラスの構文自体はJavaScriptと同様ですが、このような型チェックが加わることでより堅牢なコードを書くことができます。