TypeScript 如何定义枚举

很多开发朋友在写代码时,总免不了要面对一些“固定值集合”的场景,比如一周只有7天、交通信号灯只有红黄绿三种状态,要是随便用一串数字或字符串来标记,很容易写错值,还不容易看出含义。TypeScript里的“枚举”功能,就是为解决这个问题设计的。

什么是TypeScript里的枚举

你可以把枚举理解成“给一组固定值起个好记的名字”,就像把“1”叫“周一”,“2”叫“周二”一样。举个生活化的例子:你开了个奶茶店,店里的杯子只有“小杯”“中杯”“大杯”三种,要是用数字1、2、3代替杯子大小,过了一周再看代码,可能会忘了1对应什么;但用枚举把这三个值分别命名为Small、Medium、Large,下次看到代码就知道是杯子大小,不容易搞错。

TypeScript 如何定义枚举

TypeScript的枚举还能自动给这些名字配对应的值,不用手动一个个写,特别方便。

最常用的数字枚举:自动赋值不费脑

数字枚举是TypeScript里最基础的类型,默认从0开始自动赋值,后面的每一项比前一项多1。比如我们定义一周的工作日:

`typescript

enum Weekday {

Monday,

Tuesday,

Wednesday,

Thursday,

Friday

}

`

这里Monday会自动对应0,Tuesday是1,以此类推,Friday就是4。要是你需要从1开始算(比如周一对应1),也可以手动改第一个值:

`typescript

enum Weekday {

Monday = 1,

Tuesday, // 自动变成2

Wednesday // 自动变成3

}

`

这种枚举用在需要用数字区分状态的场景,比如奶茶店订单状态:1=待取餐,2=配送中,3=已完成,数字值能直接存到数据库里,不用存字符串,很省空间。

字符串枚举:直观好懂少出错

要是不想用数字,也可以用字符串枚举,每个名字对应你能看懂的字符串,比数字更直观。比如你做电商项目,用字符串枚举定义订单状态:

`typescript

enum OrderStatus {

Pending = "待付款",

Paid = "已付款",

Shipped = "已发货",

Completed = "已完成"

}

`

这种枚举的好处是,打印日志或调试时,直接看到“待付款”,不用再把数字转成对应状态,出错率低。比如你判断订单是否能发货,直接写if (status === OrderStatus.Paid),一眼就能看懂逻辑。

枚举的小技巧:反向映射帮你省事儿

TypeScript的数字枚举还有个实用的反向映射功能,就是能通过数字拿到对应的名字。比如刚才的工作日枚举,你写console.log(Weekday[1]),会输出“Tuesday”,相当于把数字又转成了好记的名字,做日志输出或状态提示特别方便。

不过要注意,字符串枚举没有反向映射,因为字符串可能重复,TypeScript没法确定你要对应哪个名字,用的时候得留意。

最后说个小提醒:枚举是TypeScript的特有功能,转成JavaScript后会变成普通的对象,要是你写的代码要兼容纯JS项目,或者只是写简单的小脚本,不用刻意用枚举,平时开发前端或Node.js项目时,用枚举能帮你少踩很多“值写错”的坑,是很实用的小工具。

上一篇 JavaScript 如何改变 this 指向