TypeScript上級

上級 TypeScriptで実装するデザインパターン実践集｜練習問題編

 

導入

デザインパターンは、ソフトウェア開発における一般的な問題に対する再利用可能な解決策を提供します。特に、TypeScriptを使用することで、型安全性を保ちながら柔軟で拡張性の高いコードを実現できます。本記事では、デザインパターンの実践的な適用例を通じて、特定のシチュエーションにおける課題解決を目指します。

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

重要な概念の整理

デザインパターンには、構造、生成、行動の3つのカテゴリがあります。具体的なシチュエーションを考えると、例えば、複数の異なるデータソースからデータを取得し、統一されたインターフェースで提供する必要がある場合、ファサードパターンやストラテジーパターンが有効です。このような場面では、コードの可読性や保守性を高めることが求められます。

コード例（TypeScript）


interface DataSource {
    fetchData(): string;
}

class APIDataSource implements DataSource {
    fetchData(): string {
        return "APIからのデータ";
    }
}

class DatabaseDataSource implements DataSource {
    fetchData(): string {
        return "データベースからのデータ";
    }
}

class DataFetcher {
    private dataSource: DataSource;

    constructor(dataSource: DataSource) {
        this.dataSource = dataSource;
    }

    fetch(): string {
        return this.dataSource.fetchData();
    }
}

// 使用例
const apiDataFetcher = new DataFetcher(new APIDataSource());
console.log(apiDataFetcher.fetch());

const dbDataFetcher = new DataFetcher(new DatabaseDataSource());
console.log(dbDataFetcher.fetch());

コードの行ごとの解説

  1. interface DataSource: データソースのインターフェースを定義します。
  2. class APIDataSource: APIからデータを取得する具体的な実装です。
  3. class DatabaseDataSource: データベースからデータを取得する具体的な実装です。
  4. class DataFetcher: データソースを受け取り、データを取得するメソッドを提供します。
  5. constructor(dataSource: DataSource): データソースを依存性注入します。
  6. fetch(): 指定されたデータソースからデータを取得するメソッドです。
  7. 使用例: APIデータとデータベースデータをそれぞれ取得する例を示します。

練習問題編

以下にデザインパターンに関連する練習問題を用意しました。各問題に対する模範解答も記載しています。

  1. 問題1: ファサードパターンを使用して、異なるデータソースからデータを統一的に取得するクラスを作成してください。

    模範解答: DataFetcherクラスをファサードとして使用し、複数のデータソースを統合する方法を示します。

  2. 問題2: ストラテジーパターンを用いて、異なるデータ取得戦略を切り替える方法を実装してください。

    模範解答: DataFetcherに対して、異なるデータソースを受け取ることで、戦略の切り替えを可能にします。

  3. 問題3: 上記のコードにエラーハンドリングを追加し、データ取得に失敗した場合の処理を実装してください。

    模範解答: fetchDataメソッド内でtry-catchを使用し、エラー時に適切なメッセージを返すようにします。

  4. 問題4: 新たなデータソースとして、ローカルファイルからデータを取得するクラスを追加してください。

    模範解答: FileDataSourceクラスを作成し、fetchDataメソッドでローカルファイルを読み込む処理を実装します。

  5. 問題5: 依存性注入を使用して、DataFetcherのテスト可能性を向上させる方法を考えてください。

    模範解答: DataFetcherにモックデータソースを注入し、ユニットテストを実施することで、テストの独立性を確保します。

まとめ

  • デザインパターンは、特定のシチュエーションにおける効果的な解決策を提供します。
  • TypeScriptを使用することで、型安全なコードを実現しつつ、デザインパターンを適用できます。
  • 練習問題を通じて、実際の業務に役立つ知識を深めることが可能です。
RELATED POST