TS-常量枚举

如果使用普通的数值枚举或字符串枚举,在编译成JavaScript代码后会产生较多代码来支持各项功能,开销较大且可读性较差,而且很可能被人误用。例如,使用索引查找或反向映射会导致可读性进一步变差,出错率进一步提高。

要解决上述问题,使用常量枚举。要定义常量枚举,只需在普通枚举的定义前面加上const关键字,示例代码如下。

复制代码
const enum Answer {
    no,
    yes,
}
 
let actualAnswer: Answer = Answer.yes;

此时如果编译这段代码,你可以发现它与普通枚举编译后产生的JavaScript代码存在区别。以下是普通枚举编译后产生的JavaScript代码。

复制代码
var Answer;
(function (Answer) {
    Answer[Answer["no"] = 0] = "no";
    Answer[Answer["yes"] = 1] = "yes";
})(Answer || (Answer = {}));
var actualAnswer = Answer.yes;

以下是常量枚举编译后产生的JavaScript代码,整体上更精简。

复制代码
var actualAnswer = 1 /* yes */;

如果对常量枚举使用索引查找或反向映射,编译将无法通过,示例代码如下。

复制代码
let inputString: string = "yes";
//编译错误:只有使用字符串文本才能访问常数枚举成员。ts(2476)
let userAnswer: Answer = Answer[inputString]; 
//编译错误:只有使用字符串文本才能访问常数枚举成员。ts(2476)
let nameOfyes: string = Answer[Answer.yes]; 
相关推荐
naildingding12 小时前
3-ts接口 Interface
前端·typescript
ZengLiangYi12 小时前
TypeScript 项目配置:tsconfig、ESM、路径别名
javascript·typescript·aigc
退休倒计时18 小时前
【每日一题】LeetCode 15. 三数之和 TypeScript
数据结构·算法·leetcode·typescript
FlyWIHTSKY20 小时前
JavaScript 和 TypeScript 分别是什么,可以相互写吗
javascript·ubuntu·typescript
云水一下20 小时前
TypeScript 从零基础到精通(七):从配置到全栈项目落地
前端·javascript·typescript
Aolith21 小时前
从 Pinia 到 Zustand:我在 React 里复刻了一套用户状态管理
前端·react.js·typescript
Aolith21 小时前
Express + TypeScript 下写 JWT 中间件,我踩了三个坑
typescript·node.js·express
夜雪闻竹1 天前
测试策略:单元测试 + 集成测试怎么写
typescript·单元测试·集成测试·chatcrystal
JieE2122 天前
Bun + TypeScript:下一代 JavaScript 全栈开发的正确打开方式
typescript·全栈·bun
GuWenyue2 天前
告别JS类型坑!Ts为什么在ai时代逐渐成为"第一"语言
前端·算法·typescript