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

共 1381字,需浏览 3分钟

 ·

2023-01-07 00:11


使用对象初始化变量时,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, 并且使用基本值作为其类型。


浏览 71
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报