JavaScript　クラスの定義方法、使い方まとめ

JavaScriptの「クラス」の定義方法、使い方について解説します。

「クラス」って何でしょうか？

「クラス」は、オブジェクト指向プログラミングの概念で、同じようなプロパティやメソッドを持つオブジェクトを作るためのテンプレートのことです。

「クラス」とは何か？「クラス」を使うメリット

　「クラス」は、JavaScriptのオブジェクト指向プログラミングの概念です。「クラス」は、特定のタイプのオブジェクトを作成するための設計図のようなものです。

「クラス」を使用することで、同じようなプロパティやメソッドを持つオブジェクトを簡単に作成することができます。「クラス」は、大量のオブジェクトを作成する場合に効率的です。

クラスを使うメリット

同じような処理を行う複数のオブジェクトを簡単に作成することができます。
コードをわかりやすく、管理しやすくなります。
「クラス」を使用することで、プログラムの変更や修正が簡単になります。

「クラス」の定義方法

「class」キーワードを使った定義

　「class」キーワードを使って「クラス」を定義する方法は以下の通りです。

class クラス名 {
  constructor() {
    // コンストラクタ内で実行する処理
  }
  // クラス内のメソッドやプロパティ
}

「constructor」メソッドについて

「constructor」メソッドは、「クラス」から作成されるオブジェクトを初期化するためのメソッドです。

　「constructor」メソッドは「class」キーワードを使って「クラス」を定義すると同時に自動的に生成されます。「constructor」メソッドには、「クラス」から作成されるオブジェクトに必要なプロパティやメソッドを設定することができます。

class Car {
  constructor(make, model) {
    this.make = make;
    this.model = model;
  }
}

const myCar = new Car("Toyota", "Corolla");
console.log(myCar.make); // Toyota
console.log(myCar.model); // Corolla

　このサンプルコードでは、「Car」というクラスを定義しています。このクラスは、「make」と「model」の2つのプロパティを持っています。「constructor」メソッド内では、「make」と「model」の2つのプロパティを初期化することができます。

　最後に、「new」演算子を使って「myCar」という名前の「Car」クラスのインスタンスを作成し、「console.log」を使って「make」と「model」の2つのプロパティを表示しています。

「メソッド」の定義方法

　「メソッド」とは、クラス内で定義された関数のことです。

　「メソッド」は、「クラス」内で作られたインスタンスから呼び出すことができます。「メソッド」は「class」ブロック内に記述します。次のような形式で定義されます。

class クラス名 {
  メソッド名(引数) {
    処理;
  }
}

「getter」「setter」メソッド

　「getter」メソッドは、「クラス」のインスタンスからプロパティ値を取得するためのメソッドです。「setter」メソッドは、「クラス」のインスタンスのプロパティ値を設定するためのメソッドです。「getter」「setter」メソッドは、次のように定義します。

class クラス名 {
  get プロパティ名() {
    return 値;
  }
  set プロパティ名(値) {
    処理;
  }
}

「クラス」を使ったサンプルプログラムと解説

　以下は、「クラス」を使ったサンプルプログラムです。このサンプルでは「Person」クラスを定義して、「Person」クラスのインスタンスを作成して、「Person」クラスの「greet」メソッドを呼び出しています。

class Car {
  constructor(make, model) {
    this.make = make;
    this.model = model;
  }

  getDescription() {
    return `This car is a ${this.make} ${this.model}.`;
  }
}

const myCar = new Car('Toyota', 'Camry');
console.log(myCar.getDescription());  // This car is a Toyota Camry.

このプログラムの解説は以下の通りです。

classキーワードを使って「クラス」の定義を開始します。
constructorメソッドは「クラス」のインスタンスが作られたときに呼び出されます。このメソッドでは「クラス」のインスタンスに必要なプロパティを設定します。
getDescriptionメソッドは「クラス」のインスタンスに関連付けられた情報を整理して文字列として返すものです。
const myCar = new Car('Toyota', 'Camry');で「Car」クラスのインスタンスを作成します。
console.log(myCar.getDescription());で「myCar」インスタンスからgetDescriptionメソッドを呼び出して、「この車はトヨタ・カムリです。」という文字列を取得します。