JavaScript上級

上級 JavaScriptで学ぶオブジェクト指向設計｜練習問題編

 

導入

オブジェクト指向設計は、ソフトウェア開発において複雑なシステムを扱う際に非常に有効なアプローチです。特にJavaScriptは、オブジェクトを中心に設計されているため、オブジェクト指向の原則を適切に理解し、実践することが重要です。この記事では、具体的なシチュエーションを通じてオブジェクト指向設計の実践的な側面を探ります。

教科書レベルの解説（オブジェクト指向設計）

重要な概念の整理

オブジェクト指向設計では、主に「カプセル化」「継承」「ポリモーフィズム」といった概念が重要です。カプセル化によりデータとその操作を一つのオブジェクトにまとめ、外部からのアクセスを制御します。継承は、既存のクラスから新しいクラスを作成することで、コードの再利用を促進します。ポリモーフィズムは、異なるオブジェクトが同じメソッドを持ち、異なる動作を実現する能力を指します。

コード例（JavaScript）


class Vehicle {
    constructor(brand, model) {
        this.brand = brand;
        this.model = model;
    }

    displayInfo() {
        return `${this.brand} ${this.model}`;
    }
}

class Car extends Vehicle {
    constructor(brand, model, doors) {
        super(brand, model);
        this.doors = doors;
    }

    displayInfo() {
        return `${super.displayInfo()} with ${this.doors} doors`;
    }
}

const myCar = new Car('Toyota', 'Corolla', 4);
console.log(myCar.displayInfo());

コードの行ごとの解説

  1. class Vehicle { – Vehicleクラスを定義します。
  2. constructor(brand, model) { – コンストラクタでブランドとモデルを受け取ります。
  3. this.brand = brand; – インスタンス変数としてブランドを設定します。
  4. displayInfo() { – 車両情報を表示するメソッドを定義します。
  5. class Car extends Vehicle { – Vehicleクラスを継承したCarクラスを定義します。
  6. constructor(brand, model, doors) { – コンストラクタでドア数も受け取ります。
  7. super(brand, model); – 親クラスのコンストラクタを呼び出します。
  8. displayInfo() { – 親クラスのメソッドをオーバーライドして、ドア数を追加します。
  9. const myCar = new Car('Toyota', 'Corolla', 4); – Carクラスのインスタンスを作成します。
  10. console.log(myCar.displayInfo()); – 車両情報をコンソールに出力します。

練習問題編

以下の練習問題に取り組んで、オブジェクト指向設計の理解を深めましょう。

  1. 問題1: Vehicleクラスに「年式」を追加し、Carクラスにも反映させるように修正してください。
  2. 問題2: 複数の車両を管理するGarageクラスを作成し、車両を追加・表示するメソッドを実装してください。
  3. 問題3: Carクラスに「燃費」を追加し、燃費を表示するメソッドを実装してください。

まとめ

  • オブジェクト指向設計は、複雑なシステムを管理しやすくするための強力な手法です。
  • 継承やポリモーフィズムを活用することで、再利用可能なコードを作成できます。
  • 実際の業務で遭遇するシチュエーションを通じて、理論を実践に生かすことが重要です。
RELATED POST