掌握型別檢查的力量

為什麼使用 any 會讓你的程式碼走向危險？

慎用 any！讓程式碼更嚴謹，避免隱藏的問題

在 TypeScript 中，any 提供了極大的靈活性，允許變數可以是任何型別。
然而，這種靈活性常常讓程式碼變得脆弱，失去了 TypeScript 型別檢查的優勢。

為了編寫高品質、嚴謹的程式碼，我們應該盡量避免使用 any，除非在特定情況下我們確定它是必要的。
本文將來討論什麼情況下可以使用 any，並且不使用 any 會讓你的程式碼更加健壯和安全。

程式碼

declare const deliveryAddresses: string[]

deliveryAddresses.push('421 Smashing Hill, 90210') // ok

function selectDeliveryAddress(addressOrIndex: any) {
  if (typeof addressOrIndex === 'number') {
    return deliveryAddresses[addressOrIndex]
  }
  return addressOrIndex
}

selectDeliveryAddress('yes please')

錯誤提示

No error detected during compilation, but unexpected behaviors might occur at runtime.

Errors in code

沒有出現錯誤訊息。
在這段程式碼中，使用了 any 來接受參數，導致了幾個潛在的問題：

1. addressOrIndex 可以是任何型別，這可能導致無法預測的行為。
2. 程式在編譯時不會報錯，讓開發者無法提早發現問題，增加了維護和除錯的成本。

解讀錯誤訊息

使用 any 犧牲了 TypeScript 最重要的優勢：型別檢查。
這讓我們無法在編譯時檢測出不合適的型別或錯誤行為。

即使你的程式碼在編譯時沒有報錯，可能會在執行時產生意外的問題。
當我們放棄型別嚴謹性時，潛在的錯誤會變得更加難以追蹤和解決。

什麼時候才可以用 any？

儘管我們應該避免使用 any，但在某些特殊情況下，any 是不可避免或適合使用的。這些情況包括：

1. 逐步轉型：當你在從 JavaScript 轉移到 TypeScript 的過程中，any 可以作為一個過渡的型別，讓你逐步將型別系統應用到現有的程式碼。

2. 第三方程式庫的弱型別介面：當使用某些未提供型別定義的第三方程式庫時，可能會需要 any 來處理它們的輸出或回傳值。

3. 動態資料處理：如果你需要處理動態資料來源，並且該資料的型別在開發階段無法預知時，any 可以幫助你靈活地處理這類情況，前提是要小心使用並做好必要的型別檢查。

4. 臨時解決問題：如果你無法立即提供正確的型別，但又需要讓程式碼先行運作，可以暫時使用 any，但務必要在後續替換為適當的型別。

解決步驟

為了增強程式碼的型別嚴謹性，我們可以使用聯合型別來確保 addressOrIndex 只接受字串或數字：

function selectDeliveryAddress(addressOrIndex: string | number) {
  if (typeof addressOrIndex === 'number') {
    return deliveryAddresses[addressOrIndex]
  }
  return addressOrIndex
}

selectDeliveryAddress('yes please') // ok
selectDeliveryAddress(0) // ok

最後結果

透過引入聯合型別，我們確保了程式的型別安全性，同時避免了不必要的 any。這樣的程式碼不僅更加可維護，也能夠幫助我們更早發現錯誤，減少在執行時出現潛在問題的可能性。

演練區

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

試著將原本使用 any 的程式碼轉換成使用具體型別，觀察型別檢查的好處。TypeScript 的強大之處在於它可以保護你的程式免於出現無法預期的錯誤，透過這些練習，你會更加熟悉如何避免使用 any。

總結小語

• 使用 any 雖然簡單方便，但它會破壞 TypeScript 的型別安全性。
• any 會讓程式碼變得難以維護，增加除錯與問題排查的難度。
• 避免使用 any，強化型別管理，才是寫出高品質 TypeScript 程式的關鍵。
• 選擇適當的型別，不僅能讓程式碼更穩定，還能提早在編譯時發現問題。