TypeScript上級

上級 TypeScriptで学ぶデザインパターン｜練習問題編

 

導入

デザインパターンは、ソフトウェア開発において再利用可能な解決策を提供します。特に、TypeScriptのような型安全な言語では、デザインパターンを適切に活用することで、コードの可読性やメンテナンス性が向上します。本記事では、現場でよく遭遇する「ストラテジーパターン」を取り上げ、その実装方法と注意点を解説します。

教科書レベルの解説（デザインパターン）

重要な概念の整理

ストラテジーパターンは、アルゴリズムの選択をクライアントから分離するためのパターンです。これにより、アルゴリズムを変更する際にクライアントコードを変更する必要がなくなります。特に、異なる戦略を持つクラスが多数存在する場合に有効です。

コード例（TypeScript）


interface Strategy {
    execute(a: number, b: number): number;
}

class AddStrategy implements Strategy {
    execute(a: number, b: number): number {
        return a + b;
    }
}

class SubtractStrategy implements Strategy {
    execute(a: number, b: number): number {
        return a - b;
    }
}

class Context {
    private strategy: Strategy;

    constructor(strategy: Strategy) {
        this.strategy = strategy;
    }

    setStrategy(strategy: Strategy) {
        this.strategy = strategy;
    }

    executeStrategy(a: number, b: number): number {
        return this.strategy.execute(a, b);
    }
}

// 使用例
const context = new Context(new AddStrategy());
console.log(context.executeStrategy(5, 3)); // 8
context.setStrategy(new SubtractStrategy());
console.log(context.executeStrategy(5, 3)); // 2

コードの行ごとの解説

  1. interface Strategy: 戦略のインターフェースを定義します。
  2. class AddStrategy: 加算の具体的な戦略を実装します。
  3. class SubtractStrategy: 減算の具体的な戦略を実装します。
  4. class Context: 現在の戦略を保持し、実行するためのクラスです。
  5. setStrategy: 戦略を変更するメソッドです。
  6. executeStrategy: 現在の戦略を用いて処理を実行します。
  7. 使用例: コンテキストを生成し、戦略を切り替えて実行します。

練習問題編

以下の練習問題に挑戦してください。各問題の後に模範解答と解説があります。

  1. 問題1: ストラテジーパターンを用いて、掛け算の戦略を追加してください。
  2. 問題2: コンテキストクラスに、現在の戦略を表示するメソッドを追加してください。
  3. 問題3: 異なる戦略を持つ複数のコンテキストを作成し、それぞれの結果を表示してください。

模範解答

  1. 問題1の解答:

    
class MultiplyStrategy implements Strategy {
    execute(a: number, b: number): number {
        return a * b;
    }
}
  2. 問題2の解答:

    
class Context {
    // ...既存のコード...

    displayCurrentStrategy(): string {
        return this.strategy.constructor.name;
    }
}
  3. 問題3の解答:

    
const context1 = new Context(new AddStrategy());
const context2 = new Context(new MultiplyStrategy());

console.log(context1.executeStrategy(5, 3)); // 8
console.log(context2.executeStrategy(5, 3)); // 15

まとめ

  • ストラテジーパターンは、アルゴリズムの選択を柔軟に行えるようにします。
  • TypeScriptの型システムを利用することで、戦略の安全な実装が可能です。
  • 現場での適用を考慮し、実際の業務に役立つ形でデザインパターンを利用してください。
RELATED POST