don＆＃t使用像這樣的打字稿類型。改用地圖模式

此打字稿實現展示了一個重構過程，以提高靈活性和可維護性。 讓我們重新提示它以清晰並改善流程。

增強打字稿的靈活性與地圖模式：案例研究

在最近的一個項目中，我遇到了一個打字稿實現，儘管功能雖然缺乏靈活性。本文詳細介紹了問題，使用地圖模式的解決方案以及該方法如何增強代碼可維護性。 目錄的

表

初始問題

原始方法的限制

1. 實施地圖模式解決方案
2. 清潔代碼實現
3. 使用允許的反應執行類型安全
4. 視覺比較
5. 結論
7. 1。初始問題

原始代碼使用了這些打字條類型：

此

>在評分函數中使用：

>

<code class="language-typescript">// Reaction.ts
export type Reaction = {
  count: number;
  percentage: number;
};

// FinalResponse.ts
import { Reaction } from './Reaction';

export type FinalResponse = {
  totalScore: number;
  headingsPenalty: number;
  sentencesPenalty: number;
  charactersPenalty: number;
  wordsPenalty: number;
  headings: string[];
  sentences: string[];
  words: string[];
  links: { href: string; text: string }[];
  exceeded: {
    exceededSentences: string[];
    repeatedWords: { word: string; count: number }[];
  };
  reactions: {
    likes: Reaction;
    unicorns: Reaction;
    explodingHeads: Reaction;
    raisedHands: Reaction;
    fire: Reaction;
  };
};</code>

FinalResponse 2。原始方法的局限

添加新的反應需要對多個文件進行修改（，

<code class="language-typescript">// calculator.ts
export const calculateScore = (
  // ... input parameters ...
  reactions: {
    likes: Reaction;
    unicorns: Reaction;
    explodingHeads: Reaction;
    raisedHands: Reaction;
    fire: Reaction;
  },
): FinalResponse => {
  // Score calculation logic...
};</code>

，以及可能的其他反應）。這種緊密的耦合增加了錯誤的風險，並使代碼降低了可維護。

> 3。實施地圖模式解決方案

為了解決這個問題，實現了一種使用FinalResponse.ts類似結構的更具動態的方法：calculator.ts

4。清潔代碼實現

Map函數現在使用

>：

<code class="language-typescript">// FinalResponse.ts
import { Reaction } from './Reaction';

type AllowedReactions =
  | 'likes'
  | 'unicorns'
  | 'explodingHeads'
  | 'raisedHands'
  | 'fire';

export type ReactionMap = {
  [key in AllowedReactions]: Reaction;
};

export type FinalResponse = {
  // ... other properties ...
  reactions: ReactionMap;
};</code>

>

5。使用允許的反應

執行類型的安全性 calculateScore> ReactionMap具有靈活性，但對於維持類型安全至關重要。聯合類型限制了允許的反應鍵，以防止添加任意反應。 6。視覺比較

<code class="language-typescript">// calculator.ts
export const calculateScore = (
  // ... input parameters ...
  reactions: ReactionMap,
): FinalResponse => {
  // Score calculation logic...
};</code>

ReactionMap7。結論AllowedReactions

這種重構方法平衡了靈活性和類型的安全性。與原始緊密耦合的設計相比，添加新反應僅需要更新類型，可顯著提高可維護性並降低錯誤的風險。 使用A類型有效地模擬了地圖的好處，而沒有A

對象的運行時開銷。 >

以上是don＆＃t使用像這樣的打字稿類型。改用地圖模式的詳細內容。更多資訊請關注PHP中文網其他相關文章！