Typescript高级技巧-基本类型中的const

使用对象初始化变量时，TypeScript 认为该对象的属性是可以被更改的。例如，如果您编写了这样的代码：

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

TypeScript 不会认为把 counter 从0改为1是错误的，只要 counter 符合数字类型就可以。

function handleRequest (url: string, method: 'GET' | 'POST') {}
const req = { url: "https://example.com", method: "GET" };handleRequest(req.url, req.method);// 类型“string”的参数不能赋给类型“"GET" | "POST"”的参数。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，但对于类型系统，确保所有属性都分配了文字类型，而不是更通用的基础类型，如字符串或数字。

这个最简单的声明，Typescript 会推断出 age 的类型是 number，你可以对它赋任何数值。

let age = 30// age类型为number

但如果我们使用const声明这个变量，它的类型会变成什么？

const age = 30// age类型为30

可以看到 30 就变成它的类型，而且再也无法更改。字符串也一样，会有这种限制。

如果对一个数组使用 const 定义，情况就有点不一样了，看下面的例子。它只是定义了 cars 为字符串数组类型，你还是可以对数组进行各种操作，比如插入一个数组元素之类的。

const cars = ['A', 'B', 'C']// cars类型为string[]

如果你想限定死数组，那就需要加 as const, 如下：

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

对象和数组差不多，如果直接 const 定义，你还是可以直接修改对象的字段，除非加入 as const，这样它会给每个字段加入 readonly, 并且使用基本值作为其类型。