釋放 TypeScript「as const」的力量：您需要了解的被低估的功能

在討論 TypeScript 中最被低估的功能時，經常被忽略的一個功能是 as const 斷言。這個功能在各種場景下都非常有用，為開發者帶來了顯著的好處。

理解“as const”

首先，讓我們先定義 const 的作用。想像你有一個像這樣的對象：

const routes = {
  home: "/home",
  profile: "/profile",
  notifications: "/notification",
};

如果您將滑鼠懸停在路線的屬性上，您會注意到它們被鍵入為字串。例如，routes.home 被輸入為字串，而不是“/home”。這是因為 TypeScript 假設這些屬性可能會更改，因此它將它們推斷為可變字串。

現在，考慮一個應該只接受這些特定路由的函數。您可以像這樣定義類型：

function changeRoute(route: "home" | "profile" | "notifications") {
  // navigate to route
}

這種方法有效，但重複且容易出錯。如果新增路由，則必須更新函數的類型定義，這並不理想。

使物件不可變

這就是 as const 發揮作用的地方。透過使用 as const，您可以使物件不可變，並且 TypeScript 將推斷文字類型而不僅僅是字串。

const routes = {
  home: "/home",
  profile: "/profile",
  notifications: "/notification",
} as const;

現在，routes.home 鍵入為“/home”，routes.notifications 鍵入為“/notifications”，依此類推。這種不變性確保這些屬性無法更改，並且 TypeScript 可以識別它們的特定值。

實際用例

讓我們將 const 整合到函數中：

function changeRoute(route: typeof routes[keyof typeof routes]) {
  // navigate to route
}

這裡，typeofroutes 取得路由物件的類型，keyoftypeofroutes 提取鍵，從而得到路由值的確切類型。這使得函數能夠適應路由物件中的任何變化，而不需要重複更新。

提取類型

as const 的另一個強大的方面是它如何實現類型提取。例如：

type Routes = (typeof routes)[keyof typeof routes];

這種類型的定義動態提取路由物件的值，使函數更易於維護並減少冗餘。

結論

TypeScript 中的 as const 斷言是一個多功能且強大的功能，可以顯著提高類型安全性並減少程式碼中的冗餘。透過使物件不可變並啟用精確的類型推斷，它簡化了程式碼庫的維護和擴展。嘗試一下，您就會發現它如何增強您的 TypeScript 專案！
快樂編碼！

[披露：本文是協作成果，結合了我自己的想法並在 ChatGPT 的幫助下增強了清晰度。 ]

以上是釋放 TypeScript「as const」的力量：您需要了解的被低估的功能的詳細內容。更多資訊請關注PHP中文網其他相關文章！