super キーワードは、オブジェクトの親の関数を呼び出すために使用できます。

super.prop および super[expr] 式は、classオブジェクトリテラル の両方におけるあらゆるメソッド定義で有効です。

構文

super([arguments]); // 親コンストラクターを呼び出します。
super.functionOnParent([arguments]);

解説

コンストラクター内で使用する場合、super キーワードを単独で置き、this キーワードが使われる前に使用しなくてはなりません。このキーワードは、親オブジェクトの関数を呼び出すためにも使用できます。

クラス内での super の使用

このコードスニペットは、classes sample (実際のデモ) からとっています。super() を利用することで、RectangleSquare のコンストラクターに共通する処理を重複して記述しないようにしています。

class Rectangle {
  constructor(height, width) {
    this.name = 'Rectangle';
    this.height = height;
    this.width = width;
  }
  sayName() {
    console.log('Hi, I am a ', this.name + '.');
  }
  get area() {
    return this.height * this.width;
  }
  set area(value) {
    this.height = this.width = Math.sqrt(value);
  }
}

class Square extends Rectangle {
  constructor(length) {
    this.height; // ReferenceError になります。super を先に呼び出さなければなりません!

    // length の値で親クラスの constructor を呼びます。
    // Rectangle の width と height になります。
    super(length, length);

    // Note: 'this' を使う前に super() をコールしなければなりません。
    // でないと reference error になります。
    this.name = 'Square';
  }
}

静的メソッドでの super の呼び出し

static メソッドでも super を呼び出すことができます。

class Rectangle {
  constructor() {}
  static logNbSides() {
    return 'I have 4 sides';
  }
}

class Square extends Rectangle {
  constructor() {}
  static logDescription() {
    return super.logNbSides() + ' which are all equal';
  }
}
Square.logDescription(); // 'I have 4 sides which are all equal'

super プロパティの削除でエラーが発生

親クラスのプロパティを削除するために、 delete 演算子super.propsuper[expr] を使うことはできません。 ReferenceError がスローされます。

class Base {
  constructor() {}
  foo() {}
}
class Derived extends Base {
  constructor() {}
  delete() {
    delete super.foo; // this is bad
  }
}

new Derived().delete(); // ReferenceError: invalid delete involving 'super'. 

super.prop は書き込み不可能なプロパティを上書きできない

Object.defineProperty などで書き込み不可プロパティを定義した場合、super はプロパティの値を上書きできません。

class X {
  constructor() {
    Object.defineProperty(this, 'prop', {
      configurable: true,
      writable: false, 
      value: 1
    });
  }
}

class Y extends X {
  constructor() {
    super();
  }
  foo() {
    super.prop = 2;   // 値を上書きできない
  }
}

var y = new Y();
y.foo(); // TypeError: "prop" は読み取り専用
console.log(y.prop); // 1

オブジェクトリテラル内での super.prop の使用

super は object initializer / literal 記法内でも使用できます。この例では、二つのオブジェクトがメソッドを定義しています。二つ目のオブジェクトの中で、 super が最初のオブジェクトのメソッドを呼び出しています。これは Object.setPrototypeOf() の助けで動作し、これは obj2 のプロトタイプを obj1 に設定するので、 supermethod1obj1 上で見つけることができます。

var obj1 = {
  method1() {
    console.log('method 1');
  }
}

var obj2 = {
  method2() {
    super.method1();
  }
}

Object.setPrototypeOf(obj2, obj1);
obj2.method2(); // logs "method 1"

仕様書

仕様書 状態 備考
ECMAScript Latest Draft (ECMA-262)
super の定義
ドラフト  
ECMAScript 2015 (6th Edition, ECMA-262)
super の定義
標準 初回定義

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung InternetNode.js
superChrome 完全対応 42Edge 完全対応 ありFirefox 完全対応 45IE 未対応 なしOpera 完全対応 ありSafari 完全対応 ありWebView Android 完全対応 42Chrome Android 完全対応 42Firefox Android 完全対応 45Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 4.0nodejs 完全対応 あり

凡例

完全対応  
完全対応
未対応  
未対応

関連情報

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

このページの貢献者: mdnwebdocs-bot, mfuji09, segayuu, woodmix, YuichiNukiyama, Marsf
最終更新者: mdnwebdocs-bot,