class 式は、ECMAScript 2015 でクラスを定義する方法の 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; // "Foo"

名前付き 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 2016 (ECMA-262)
Class definitions の定義
標準  
ECMAScript 2017 (ECMA-262)
Class definitions の定義
標準  
ECMAScript Latest Draft (ECMA-262)
Class definitions の定義
ドラフト  

ブラウザ実装状況

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung InternetNode.js
基本対応Chrome 完全対応 42Edge 完全対応 ありFirefox 完全対応 45IE 未対応 なしOpera 完全対応 ありSafari 完全対応 ありWebView Android 完全対応 42Chrome Android 完全対応 42Edge Mobile 完全対応 ありFirefox Android 完全対応 45Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 4.0nodejs 完全対応 6.0.0
完全対応 6.0.0
完全対応 5.0.0
無効
無効 From version 5.0.0: this feature is behind the --harmony runtime flag.

凡例

完全対応  
完全対応
未対応  
未対応
ユーザーが明示的にこの機能を有効にしなければなりません。
ユーザーが明示的にこの機能を有効にしなければなりません。

 

関連項目

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

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