当前位置:首页 > 科技  > 软件

AS Const 五种使用技巧,你知道多少?

来源: 责编: 时间:2024-03-20 08:51:31 131观看
导读在 TypeScript 中,as const 是一种类型断言,它将变量标记为 “常量”。使用 as const 可以告诉 TypeScript 编译器,某个对象的所有属性都是只读的,并且它们的类型是字面量类型,而不是更通用的类型,比如 string 或 number 类

mlz28资讯网——每日最新资讯28at.com

在 TypeScript 中,as const 是一种类型断言,它将变量标记为 “常量”。使用 as const 可以告诉 TypeScript 编译器,某个对象的所有属性都是只读的,并且它们的类型是字面量类型,而不是更通用的类型,比如 string 或 number 类型。接下来,我将介绍 TypeScript 中 as const 类型断言的 5 个使用技巧。mlz28资讯网——每日最新资讯28at.com

1.确保对象的属性不可变

在下面代码中,虽然你使用 const 关键字来定义 DEFAULT_SERVER_CONFIG 常量。但你仍然可以修改该对象的属性。mlz28资讯网——每日最新资讯28at.com

const DEFAULT_SERVER_CONFIG = {    host: "localhost",    port: 8080}DEFAULT_SERVER_CONFIG.port = 9090console.log(`Server Host: ${DEFAULT_SERVER_CONFIG.port}`)// "Server Host: 9090"

如果你希望该对象的属性,是只读的不允许修改,那么你可以使用 as const 类型断言。mlz28资讯网——每日最新资讯28at.com

const DEFAULT_SERVER_CONFIG = {    host: "localhost",    port: 8080} as const

之后,当你尝试修改 port 属性时,TypeScript 编译器就会提示以下错误信息:mlz28资讯网——每日最新资讯28at.com

mlz28资讯网——每日最新资讯28at.com

as const 类型断言,除了支持普通对象之外,还支持嵌套对象:mlz28资讯网——每日最新资讯28at.com

const DEFAULT_CONFIG = {    server: {        host: "localhost",        port: 8080    },    database: {        user: "root",        password: "root"    }} as const

mlz28资讯网——每日最新资讯28at.com

2.确保数组或元组不可变

在工作中,数组是一种常见的数组结构。使用 as const 类型断言,我们可以让数组变成只读。mlz28资讯网——每日最新资讯28at.com

const RGB_COLORS = ["red", "green", "blue"] as const

使用了 as const 类型断言之后,RGB_COLORS 常量的类型被推断为 readonly ["red", "green", "blue"] 类型。之后,当你往 RGB_COLORS 数组添加新的颜色时,TypeScript 编译器就会提示以下错误信息:mlz28资讯网——每日最新资讯28at.com

mlz28资讯网——每日最新资讯28at.com

除了数组之外,你也可以在元组上使用 as const 类型断言:mlz28资讯网——每日最新资讯28at.com

const person = ['kakuqo', 30, true] as const;person[0] = 'semlinker' // Error// Cannot assign to '0' because it is a read-only property.(2540)

3.常量枚举的替代方案

在下面代码中,我们使用 enum 关键字定义了 Colors 枚举类型。mlz28资讯网——每日最新资讯28at.com

const enum Colors {  Red = 'RED',  Green = 'GREEN',  Blue = 'BLUE',}let color: Colors = Colors.Red; // Okcolor = Colors.Green // Ok

除了使用枚举类型之外,利用 as const 类型断言,你也可以实现类似的功能:mlz28资讯网——每日最新资讯28at.com

const Colors = {  Red: 'RED',  Green: 'GREEN',  Blue: 'BLUE',} as const;type ColorKeys = keyof typeof Colors;type ColorValues = typeof Colors[ColorKeys]let color: ColorValues = 'RED'; // Okcolor = 'GREEN'; // Ok

4.让类型推断更精准

在下面代码中,red 变量的类型被推断为 string 类型。mlz28资讯网——每日最新资讯28at.com

const RGB_COLORS = ["red", "green", "blue"];let red = RGB_COLORS[0] // string

在某些场合中,你可能希望获取更精确的类型,比如对应的字面量类型,这时你就可以使用 as const 类型断言:mlz28资讯网——每日最新资讯28at.com

const RGB_COLORS = ["red", "green", "blue"] as const;let red = RGB_COLORS[0] // "red"

5.赋值时缩窄变量的类型

在下面代码中,使用 const 关键字定义的常量,它的类型会被推断为更精确的类型。mlz28资讯网——每日最新资讯28at.com

let color1 = "Red" // let color1: stringconst color2 = "Red" // const color2: "Red"

利用 as const 类型断言,我们也可以让 let 关键字定义的变量对应的类型更精准:mlz28资讯网——每日最新资讯28at.com

let color3 = "Red" as const // let color3: "Red"

当然,在实际工作中,如果明确定义常量,那么推荐直接使用 const 关键字来定义。mlz28资讯网——每日最新资讯28at.com

本文链接:http://www.28at.com/showinfo-26-77984-0.htmlAS Const 五种使用技巧,你知道多少?

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com

上一篇: 如何编写高性能的Java代码

下一篇: 天猫超市 4 月 1 日起下线现有会员服务,后续将推出新的权益体系

标签:
  • 热门焦点
Top