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]; 
相关推荐
阿珊和她的猫8 小时前
TypeScript 中的 `extends` 条件类型:定义与应用
javascript·typescript·状态模式
zero159712 小时前
TypeScript 快速实战系列:基础入门|TypeScript 核心语法 1 小时吃透(必备基础)
javascript·typescript·大模型编程语言
落魄江湖行15 小时前
入门篇二:Nuxt 4路由自动生成:告别手动配置路由的日子
前端·vue.js·typescript·nuxt4
条tiao条17 小时前
不止语法糖:TypeScript Set 与 Map 深度解析
前端·javascript·typescript
zhensherlock17 小时前
Protocol Launcher 系列:1Writer iOS 上的 Markdown 文档管理
javascript·笔记·ios·typescript·node.js·iphone·ipad
We་ct18 小时前
LeetCode 137. 只出现一次的数字 II:从基础到最优的两种解法详解
前端·数据结构·算法·leetcode·typescript·位运算
进朱者赤19 小时前
从 Java / Go 后端视角系统理解 TypeScript 与 Node.js:从看不懂到能参与 openclaw 这类项目开发
java·golang·typescript
阿珊和她的猫1 天前
TypeScript中的never类型: 深入理解never类型的使用场景和特点
javascript·typescript·状态模式
Irene19912 天前
TypeScript baseUrl 弃用解决(附:怎么在 Vite 中配置 resolve.alias)
typescript·vite·baseurl
蜗牛 Day Day Up2 天前
vscode运行TypeScript
ide·vscode·typescript