class 宣言は、プロトタイプベースの継承を使って、名前付きで新しいクラスを作成します。
class 式を使ってクラスを定義することもできます。しかし、class 式と異なり、class 宣言は既存のクラスを再宣言できず、再宣言しようとすると型エラーになります。
構文
class name [extends] {
// class body
}
説明
class 式と同様、class 宣言の内部は strict モード で実行されます。コンストラクタプロパティはオプションです。
class 宣言は、(function 宣言と違って) hoisted されません。
例
単純な class 宣言
次の例では、はじめに Polygon という名前のクラスを定義し、次にそれを拡張して Square という名前のクラスを作成します。コンストラクタで使われている super() は、コンストラクタ内でのみ使えること、this キーワードの使用前に呼び出さなくてはならないことに注意してください。
class Polygon {
constructor(height, width) {
this.name = 'Polygon';
this.height = height;
this.width = width;
}
}
class Square extends Polygon {
constructor(length) {
super(length, length);
this.name = 'Square';
}
}
2 度クラス宣言を行う
class 宣言を使って再度クラスを宣言すると、型エラーをスローします。
class Foo {};
class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared
class 式を使って事前にクラスを定義していたときも、同じエラーをスローします。
var Foo = class {};
class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared
仕様
| 仕様 | 状況 | コメント |
|---|---|---|
| ECMAScript 2015 (6th Edition, ECMA-262) Class definitions の定義 |
標準 | 初期定義。 |
| ECMAScript 2017 Draft (ECMA-262) Class definitions の定義 |
ドラフト |
ブラウザ実装状況
| 機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| 基本サポート | 42.0 | 45 (45) | ? | ? | ? |
| 配列サブクラス | 43.0 | 未サポート | ? | ? | ? |
| 非 strict モードでの使用 | 49.0 |
| 機能 | Android | Android Webview | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
|---|---|---|---|---|---|---|---|
| 基本サポート | 未サポート | 42.0 | 45.0 (45) | ? | ? | ? | 42.0 |
| 配列サブクラス | 未サポート | 43.0 | 未サポート | ? | ? | ? | 43.0 |
| 非 strict モードでの使用 | 未サポート | 49.0 | 49.0 |