Skip to content

プロトタイプパターン

公開日:November 17, 2024更新日:November 28, 2024
TypeScriptDesign pattern📄

プロトタイプパターン

プロトタイプパターン(Prototype Pattern) は、オブジェクトをインスタンス化するのではなく、既存のオブジェクトをコピーして新しいオブジェクトを生成するためのデザインパターンです。このパターンは、オブジェクトの生成がコストの高い処理であったり、インスタンスの複雑な初期設定が必要な場合に有効です。

プロトタイプパターンを使用することで、既存のオブジェクトを基にしたクローンを簡単に生成できるため、オブジェクトの再利用が容易になり、コードの冗長性を減らすことができます。

TypeScriptでのプロトタイプパターンの実装

以下に、TypeScriptでプロトタイプパターンを実装する例を紹介します。この例では、さまざまな形のオブジェクトを複製するシナリオを取り上げます。

形のクローンの例

typescript
// プロトタイプインターフェース
interface Prototype {
  clone(): this;
}

// 具体的なクラス(円の例)
class Circle implements Prototype {
  public radius: number;

  constructor(radius: number) {
    this.radius = radius;
  }

  clone(): this {
    // Object.createを使用して自身を複製
    const clone = Object.create(this);
    clone.radius = this.radius;
    return clone;
  }

  draw(): void {
    console.log(`Drawing a circle with radius: ${this.radius}`);
  }
}

// 具体的なクラス(正方形の例)
class Square implements Prototype {
  public sideLength: number;

  constructor(sideLength: number) {
    this.sideLength = sideLength;
  }

  clone(): this {
    // Object.createを使用して自身を複製
    const clone = Object.create(this);
    clone.sideLength = this.sideLength;
    return clone;
  }

  draw(): void {
    console.log(`Drawing a square with side length: ${this.sideLength}`);
  }
}

// 実際の使用例
const originalCircle = new Circle(10);
const clonedCircle = originalCircle.clone();

originalCircle.draw(); // "Drawing a circle with radius: 10"
clonedCircle.draw();   // "Drawing a circle with radius: 10"

const originalSquare = new Square(5);
const clonedSquare = originalSquare.clone();

originalSquare.draw(); // "Drawing a square with side length: 5"
clonedSquare.draw();   // "Drawing a square with side length: 5"

解説

  1. Prototypeインターフェース

    • Prototypeインターフェースは、オブジェクトを複製するためのcloneメソッドを定義しています。このインターフェースを実装することで、オブジェクトは自身のコピーを作成できるようになります。
  2. CircleとSquareクラス(具体的なプロトタイプ)

    • CircleクラスとSquareクラスは、それぞれ円と正方形を表現します。両クラスはPrototypeインターフェースを実装しており、cloneメソッドを使用して自身の複製を生成します。
    • cloneメソッドでは、Object.createを使用して自身のクローンを作成します。これにより、元のオブジェクトと同じプロパティを持つ新しいインスタンスを作成します。
  3. 実際の使用例

    • originalCircleをインスタンス化し、cloneメソッドで複製してclonedCircleを作成します。同様に、originalSquareをクローンして新しい正方形のインスタンスを作成します。クローンしたオブジェクトも、元のオブジェクトと同じ状態を持っています。

利点

  • オブジェクト生成の効率化: 複雑な初期設定が必要なオブジェクトを簡単に複製できるため、新しいインスタンスの生成が効率化されます。
  • 柔軟なオブジェクトの生成: 特定のクラスに依存せず、既存のインスタンスを基にして新しいオブジェクトを生成することで、柔軟にインスタンスを作成できます。
  • コードの再利用性の向上: クラスの定義を再利用して新しいオブジェクトを作成することで、冗長なコードを減らし、コードの再利用性を高めます。

使用例

  • ゲーム開発: 敵キャラクターやアイテムなど、同じような属性を持つオブジェクトを複数作成する際に、プロトタイプパターンを使って効率的にクローンを生成します。
  • GUIアプリケーション: UIコンポーネントのテンプレートを複製して、新しい画面やウィジェットを作成する際に使用されます。
  • データベースのレコード: 特定のレコードを複製して、異なるプロパティを設定した新しいレコードを生成する場合に使われます。

まとめ

プロトタイプパターンは、既存のオブジェクトをクローンすることで新しいオブジェクトを効率的に生成するデザインパターンです。TypeScriptでの実装を通じて、cloneメソッドを使ったオブジェクトの複製方法を理解しました。

このパターンを利用することで、オブジェクトの初期設定を再利用し、効率的に新しいインスタンスを生成し、コードの再利用性と保守性を向上させることが可能になります。