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 Latest Draft (ECMA-262)
Class definitions の定義
ドラフト  

ブラウザ実装状況

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

機能 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

関連項目

ドキュメントのタグと貢献者

 このページの貢献者: ambi, YuichiNukiyama, Marsf
 最終更新者: ambi,