MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

class 式は、ECMAScript 2015 (ES6) でクラスを定義する方法の 1 つです。function 式と同じように、class 式は名前を付けることも付けないこともできます。名前を付ける場合、クラス名はクラス内部のみローカルです。 JavaScript のクラスはプロトタイプベース継承が使われます。

構文

var MyClass = class [className] [extends] {  // class body };

説明

class 式の構文は、class 文(宣言) と似ています。ただし、class 式ではクラス名 (束縛識別子; "binding identifier") を省略できますが、class 文では省略できません。また、class 式は、class の再定義/再宣言が可能で、class 文 のように型エラーをスローしません。コンストラクタプロパティはオプションです。また、このキーワードを使って生成したクラスの typeof は常に "functions" になります。

class 文のように、class 式のクラス内部は strict モード で実行されます。

'use strict';
var Foo = class {}; // コンストラクタプロパティはオプション
var Foo = class {}; // 再宣言は可能

typeof Foo; // "function" を返す
typeof class {}; // "function" を返す

Foo instanceof Object; // true
Foo instanceof Function; // true
class Foo {}; // 再宣言は不可能で、TypeError を投げる

簡単な class 式

以下は、名前のない簡単な class 式です。変数 "Foo" を使って参照できます。

var Foo = class {
  constructor() {}
  bar() {
    return "Hello World!";
  }
};

var instance = new Foo();
instance.bar(); // "Hello World!"
Foo.name; // ""

名前付き class 式

クラス内部で現在のクラスを参照したい場合は、名前付きクラス式を作成してください。この名前は、その class 式自身のスコープ内でだけ見えます。

var Foo = class NamedFoo {
  constructor() {}
  whoIsThere() {
    return NamedFoo.name;
  }
}
var bar = new Foo();
bar.whoIsThere(); // "NamedFoo"
NamedFoo.name; // ReferenceError: NamedFoo is not defined
Foo.name; // "NamedFoo"

仕様

仕様 状態 コメント
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) ? ? ?
機能 Android Android Webview Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
基本サポート 未サポート 42.0 45.0 (45) ? ? ? 42.0

関連項目

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

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