Typescript高級技巧-基本類型中的const

使用對象初始化變量時，TypeScript 認為該對象的屬性是可以被更改的。例如，如果您編寫了這樣的代碼：

const obj = { counter: 0 };if (someCondition) {  obj.counter = 1;}

TypeScript 不會認為把 counter 從0改為1是錯誤的，只要 counter 符合數(shù)字類型就可以。

function handleRequest (url: string, method: 'GET' | 'POST') {}
const req = { url: "https://example.com", method: "GET" };handleRequest(req.url, req.method);// 類型“string”的參數(shù)不能賦給類型“"GET" | "POST"”的參數(shù)。ts(2345)

在上面的示例中，req.method 被推斷為字符串，而不是“GET”。TypeScript認為這段代碼有錯誤。

有兩種方法可以解決這個問題。

您可以通過在以下任一位置添加類型斷言來更改推導的類型：

// Change 1:const req = { url: "https://example.com", method: "GET" as "GET" };// Change 2handleRequest(req.url, req.method as "GET");

更改1意味著“我希望 req.method 始終具有文本類型“GET”，從而防止在之后將“GUESS”分配給該字段。更改2意味著“我知道出于其他原因，req.method 具有值“GET”。

可以使用常量將整個對象轉換為基本值作為其類型：

const req = { url: "https://example.com", method: "GET" } as const;handleRequest(req.url, req.method);

as const 后綴的作用類似于 const，但對于類型系統(tǒng)，確保所有屬性都分配了文字類型，而不是更通用的基礎類型，如字符串或數(shù)字。

這個最簡單的聲明，Typescript 會推斷出 age 的類型是 number，你可以對它賦任何數(shù)值。

let age = 30// age類型為number

但如果我們使用const聲明這個變量，它的類型會變成什么？

const age = 30// age類型為30

可以看到 30 就變成它的類型，而且再也無法更改。字符串也一樣，會有這種限制。

如果對一個數(shù)組使用 const 定義，情況就有點不一樣了，看下面的例子。它只是定義了 cars 為字符串數(shù)組類型，你還是可以對數(shù)組進行各種操作，比如插入一個數(shù)組元素之類的。

const cars = ['A', 'B', 'C']// cars類型為string[]

如果你想限定死數(shù)組，那就需要加 as const, 如下：

const cars = [1, 2, 3, 4, 5]// cars類型為readonly ["A", "B", "C"]

對象和數(shù)組差不多，如果直接 const 定義，你還是可以直接修改對象的字段，除非加入 as const，這樣它會給每個字段加入 readonly, 并且使用基本值作為其類型。