掌握 TypeScript 型別魔法，讓每個活動程式碼都安全又靈活

在這篇文章中，我們將探索 TypeScript 的魔法，並利用它來操縱多樣化的技術活動物件，從網路研討會 (Webinar) 到技術大會 (Conference)，再到社群聚會 (Meetup)。這段程式碼展示了如何運用 TypeScript 的型別系統，確保程式在處理不同型別的事件時不會出錯，並且讓我們在寫程式時少踩坑！讓我們來看看這段程式碼的精華之處吧！

定義事件型別：設計上的美妙

首先，我們定義了幾個活動型別：Talk、Conference、Meetup、Webinar，最後將它們合併成 TechEvent。這樣的設計不僅是為了程式的邏輯正確性，也是為了未來的擴展性打下基礎。

type Talk = {
  title: string,
  abstract: string,
  speaker: string
}

type Conference = {
  title: string,
  description: string,
  date: Date,
  capacity: number,
  rsvp: number,
  kind: string,
  location: string,
  price: number,
  talks: Talk[]
}

type Meetup = {
  title: string,
  description: string,
  date: Date,
  capacity: number,
  rsvp: number,
  kind: string,
  location: string,
  price: string,
  talks: Talk[]
}

type Webinar = {
  title: string,
  description: string,
  date: Date,
  capacity: number,
  rsvp: number,
  kind: string,
  url: string,
  price?: number,
  talks: Talk
}

type TechEvent = Webinar | Conference | Meetup;

這樣的設計讓每個活動都擁有獨特的屬性，比如 Webinar 的 url 和選擇性的 price，透過型別的靈活設計，我們能夠輕鬆處理每個活動的特殊需求。

魔法實作：利用型別守衛處理事件

接下來，我們撰寫了 printEvent 函數，這裡展示了 TypeScript 型別守衛的超能力，讓程式對於不同的事件作出正確的處理。

function printEvent(event: TechEvent) {
  if (event.price) {
    // Price exists!
    if (typeof event.price === 'number') {
      // We know that price is a number
      console.log('Price in EUR: ', event.price)
    } else {
      // We know that price is a string, so the
      // event is free!
      console.log('It is free!')
    }
  }

  if (Array.isArray(event.talks)) {
    // talks is an array
    event.talks.forEach(talk => {
      console.log(talk.title)
    })
  } else {
    // It's just a single talk
    console.log(event.talks.title)
  }
}

型別守衛的應用：靈活又精確

printEvent 函數中使用了型別守衛（Type Guards），如 typeof 和 Array.isArray，這些不僅能保護程式碼不出錯，還能明確地引導執行流程。例如：

• 檢查票價型別：透過 typeof event.price 確認價格是數字還是字串，以決定顯示價格或宣告免費。
• 檢查講座型別：使用 Array.isArray 判斷 talks 是否為陣列，以正確顯示多場或單場講座的標題。

這樣的操作不僅讓程式碼安全無虞，也讓開發者對每一個分支的操作都一目了然。

讓邏輯更清晰

在 printEvent 函數中，我們可以將票價的判斷邏輯抽取到 priceCheck 函數中，不僅讓程式碼更模組化，也讓每個部分的功能更加清晰。
這樣的改寫能幫助我們在未來的維護中快速定位問題，減少重複的程式碼，並且增加程式碼的可讀性。

實際應用場景：技術活動的最佳夥伴

這段程式碼在實際應用中大有可為！
例如在活動管理平台中，可以確保每個活動的資料都符合預期，不會因為不同的屬性而導致處理錯誤。

對於大型技術活動，這樣的型別保護能減少資料錯誤的風險，並且讓開發者在撰寫程式時更加安心。

型別擴展技巧：未來可期的設計

想要擴充更多型別嗎？這段程式碼也預留了無限可能。
例如，你可以輕鬆地新增 Hackathon 型別，並透過 extends 關鍵字輕鬆擴展現有的 Conference 型別。

type Hackathon = Conference & { prizes: string[] };

這樣的設計讓型別的擴展變得容易又直觀，無論是增加獎品還是其他屬性，都可以順利進行。

演練場
TypeScript: TS Playground - An online editor for exploring TypeScript and JavaScript

結論：型別就是你的超能力！

TypeScript 的型別系統不僅讓我們的程式更安全，也幫助我們在開發過程中少走彎路。
透過型別守衛和明確的屬性判斷，我們可以為技術活動的程式碼提供最堅實的保障。
不論你是新手還是老手，掌握這些技巧都能讓你的程式更上一層樓。

讓我們一起快樂地寫程式，讓 TypeScript 成為你最可靠的夥伴吧！
讓每一次的程式操作都成為最歡樂的魔法時刻！🎉✨