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

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

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

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

受講者数No.1！初心者からプロへ導く信頼のスクール

短期間で習得可能！未経験から実践力を磨く充実のプログラム

テックアカデミー 公式ページへ ≫

今なら無料相談でAmazonギフトカードがもらえる！

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

　「クラス」は、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メソッドを呼び出して、「この車はトヨタ・カムリです。」という文字列を取得します。

リスキリングでキャリアアップしてみませんか？

リスキリング(学び直し)は、経済産業省が推奨しており、

今だけ、最大７０％のキャッシュバックを受けることができます。

最大70％の給付金が出るおすすめのプログラミングスクール！

リスキリングで給付金が出るスクールを７つ紹介 ≫

国策で予算が決められているため申し込みが多い場合は早期に終了する可能性があります！

興味のある方はすぐに確認しましょう。

この記事のまとめ

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

「クラス」の定義方法がわかりました！サンプルプログラムを見ながら理解するのが一番わかりやすかったです。

「クラス」を使うことで、オブジェクトをより効率的に作成することができます。今後も「クラス」を使ったプログラミングの練習をして、スキルアップを目指しましょう！