classとは

コンストラクター関数をクラス表記で書けるようにしたもの
JavaScriptにおけるクラスは、オブジェクト指向プログラミングの概念を実現するための仕組み
クラスはオブジェクトの設計図であり、その設計図に基づいて複数のインスタンス（オブジェクト）を作成することができる

基本構文.js

class MyClass {
  constructor(prop1, prop2) {
    this.prop1 = prop1;
    this.prop2 = prop2;
  }

  method1() {
    // メソッドの処理
  }

  method2() {
    // メソッドの処理
  }
}

// クラスからインスタンスを生成する
const myInstance = new MyClass('value1', 'value2');

constructor
クラスはconstructorメソッドを持ち、インスタンスが作成される際に自動的に呼び出されるconstructorメソッド内でインスタンスの初期化やプロパティの設定を行う

クラスのメソッドは、プロトタイプ上に定義される
したがって、複数のインスタンスが同じメソッドを共有する
メソッド内のthisは、そのメソッドが呼び出されたインスタンスを指す

インスタンスの生成
クラスを元にインスタンスを生成するには、newを使用

myInstanceは、MyClassの設計に基づいて作成されたオブジェクトとなる
myInstanceはprop1とprop2のプロパティを持ち、method1とmethod2のメソッドを呼び出すことができる

クラス継承

クラスの継承は、既存のクラス（親クラスまたはスーパークラス）の特性や振る舞いを引き継いで
新しいクラス（子クラスまたはサブクラス）を作成する機能

extendsを使用してクラスの継承をする
子クラスは親クラスの特性を引き継ぎ、それに加えて独自のプロパティやメソッドを定義することが可能🐕

.js

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

  speak() {
    console.log(`${this.name} makes a sound.`);
  }
}

class Dog extends Animal { // 継承
  constructor(name, breed) {
    super(name); // 親クラスのconstructorメソッドを呼び出す
    this.breed = breed;
  }

  speak() {
    console.log(`${this.name} barks.`); // 処理内容を上書き
  }

  fetch() {
    console.log(`${this.name} fetches the ball.`); // 処理を追加
  }
}

const dog = new Dog('Max', 'Labrador');
dog.speak(); // "Max barks."
dog.fetch(); // "Max fetches the ball."

Dogクラスはextends AnimalとしてAnimalクラスを継承していおり、
親クラスのプロパティやメソッドを継承します

子クラスのconstructorメソッド内でsuper(name)を呼び出すことで、
親クラスのconstructorメソッドを実行して親クラスのプロパティを初期化する

また、子クラスは親クラスのメソッドを上書きすることも可能
speakメソッドが子クラスで上書きされており、fetchメソッドは子クラスで新しく追加されたメソッド

最後に、dogというインスタンスを生成し、子クラスのメソッドを呼び出している
dog.speak()は子クラスのspeakメソッドが実行される
console.log('${this.name} barks.');

🐕 クラスの継承を利用することで、コードの再利用性や保守性を向上させることができる
🐕 親クラスの機能を共有しながら、子クラスで独自の機能を追加することができる

【JavaScript】class - extend class

classとは

クラス継承