カワハラの、雑多な記録。

【JavaScript ES6学習】クラスの継承(inheritance)について

      2019/06/17

【JavaScript ES6学習】基礎文法編 目次

codecademyで学習したことをまとめています。
プログラミング初心者の私が学習しながら書いた、完全に自分用のメモみたいなものなので、他人が見ると意味不明だったり、間違いがある可能性があるのでご注意ください。

codecademyは無料でかなりのことが学習できる素晴らしいサイトですが、英語です。
なのでこの記事に書かれている日本語の用語も間違っているかもしれません。

今回学習した項目

codecademy
JavaScript
Lesson 9 Inheritance I, Inheritance II, Inheritance III, Inheritance IV, nheritance V

JavaScriptのクラスの継承(inheritance)

JavaScriptでは親クラス(スーパークラスとも言う)(parent class / superclass)と複数の子クラス(サブクラスとも言う)(child class / subclass)を作成できます。
小クラスは親クラスのプロパティとメソッドを継承(inheritance)します。

親クラスと子クラスのコード例。
まずは親クラスの“Animal”を作ります。
通常通りクラスを定義するだけです。

class Animal {
  constructor(name) {
    this._name = name;
    this._behavior = 0;
  }

  get name() {
    return this._name;
  }

  get behavior() {
    return this._behavior;
  }

  incrementBehavior() {
    this._behavior++;
  }
} 

次に子クラスの“Cat”の定義。
“exttends Animal”により“Animal”を親クラスとして継承しています。

class Cat extends Animal {
  constructor(name, usesLitter) {
    super(name);
    this._usesLitter = usesLitter;
  }
}

コンストラクター内に“super(name)”とありますが、親クラスのコンストラクタにnameを渡すと言う意味です。
これにより親クラスのコンストラクターが実行されます。
継承したクラスを作るときは“super()”は必ず必要です。

“_useLitter“プロパティはAnimalクラスにはなく、Catクラス独自のプロパティとして新たに定義してます。

次はCatクラスのインスタンスを作成する例。

const bryceCat = new Cat('Bryce', false); 
console.log(bryceCat._name); // output: Bryce

【JavaScript ES6学習】基礎文法編 目次

 - プログラミング - JavaScript