extends

by 2 contributors:

これは Harmony(ECMAScript 6) 提案の一部であり、実験段階の技術です。
この技術の仕様は安定していません。ブラウザ互換性の一覧表を確認してください。またこれらの構文や動作は、仕様変更などにより、新しいバージョンのブラウザでは変更される可能性があるという点に注意してください。

extendsキーワードは、class 宣言class 式内で、他のクラスの子としてクラスを作成するために使用します。

構文

class ChildClass extends ParentClass { ... }

説明

extends キーワードは、サブクラスのカスタムクラスおよび組み込みオブジェクトに使用できます。

最初の例は、Polygon と呼ばれるクラスから Square と呼ばれるクラスを作成します。

class Square extends Polygon {
  constructor(length) {
    // ここでは、親クラスのコンストラクタを呼び出し、
    // Polygon の幅と高さの length を与えます。
    super(length, length);
    // Note: 引き出されたクラスでは、'this' を使う前に
    // super() を呼び出さなくてはなりません。 こうしなければ、参照エラーになります。
    this.name = 'Square';
  }

  get area() {
    return this.height * this.width;
  }

  set area(value) {
    this.area = value;
  } 
}

この例は、組み込みの Date オブジェクトを拡張します。

class myDate extends Date {
  constructor() {|
    super();
  }

  getFormattedDate() {
    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
  }
}

デモ

上記の例は、ライブデモ (ソース) から転載しています。

仕様

仕様 状況 コメント
ECMAScript 6 (ECMA-262)
The definition of 'extends' in that specification.
勧告候補 Initial definition.

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート 42.0 Available in the Nightly channel only (since March 2015) ? ? ?
Array subclassing 43.0 未サポート ? ? ?
機能 Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート 42.0 42.0 Available in the Nightly channel only (since March 2015) ? ? ?
Array subclassing 43.0 ? 未サポート ? ? ?

関連項目

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

Contributors to this page: Marsf, YuichiNukiyama
最終更新者: Marsf,
サイドバーを隠す