プレゼンテーションシナリオ: スライド144、145

スライド144と145では、JavaScript Classesについて説明します。

例：車の管理

1. Class Car（親）:

  • プロパティを初期化するためのconstructor(name, year)があります。
  • 車の年齢を計算するためのインスタンスメソッドgetAge()があります。
  • 2台の車を比較するための静的メソッドcompareAge()があり、Car.compareAge()を通じて直接呼び出されます。

2. Class Model（子）:

  • 継承するためにextends Carを使用します。
  • コンストラクタ内で、super(name, year)を使用してCarのコンストラクタを呼び出します。
  • 詳細情報を表示するためのshowInfo()メソッドを追加します。

3. 子クラスからオブジェクトを作成:

const car1 = new Model("Toyota", 2015, "Corolla");

name、year、modelの完全な情報を持つ車を作成します。

4. メソッドの呼び出し:

  • car1.showInfo() → 子クラスのメソッドを呼び出します。
  • car1.getAge() → 親クラスから継承します。
  • Car.compareAge(car1, car2) → 親クラスの静的メソッドを呼び出します。

完全なコード:

// Parent class
class Car {
    constructor(name, year) {
        this.name = name;
        this.year = year;
    }

    // Instance method
    getAge() {
        const age = new Date().getFullYear() - this.year;
        return `${this.name} is ${age} years old.`;
    }

    // Static method
    static compareAge(car1, car2) {
        return car1.year - car2.year;
    }
}

// Child class
class Model extends Car {
    constructor(name, year, model) {
        super(name, year); // call parent constructor
        this.model = model;
    }

    // Instance method
    showInfo() {
        return `${this.name} ${this.model} (${this.year})`;
    }
}

// Create objects
const car1 = new Model("Toyota", 2015, "Corolla");
const car2 = new Model("Honda", 2018, "Civic");

// Use instance methods
console.log(car1.showInfo()); // Toyota Corolla (2015)
console.log(car1.getAge());   // Toyota is X years old

// Use static method
console.log(Car.compareAge(car1, car2)); // -3

以上で、JavaScript Classes、親/子クラスの作成方法、constructor、インスタンスメソッド、静的メソッドの使用についての説明を終わります。