const enum 与enum的区别
时间: 2025-08-08 16:58:41 浏览: 4
在 TypeScript 中,`enum` 和 `const enum` 是两种用于定义命名常量集合的机制,但它们在编译时的行为和生成的代码结构上有显著区别。
普通 `enum` 在编译为 JavaScript 时会生成一个实际的对象,这个对象在运行时存在,并可以通过枚举的名称访问对应的值。例如:
```typescript
enum Direction {
Up = 1,
Down,
Left,
Right
}
```
上述代码在编译成 JavaScript 后会生成如下代码:
```javascript
var Direction;
(function (Direction) {
Direction[Direction["Up"] = 1] = "Up";
Direction[Direction["Down"] = 2] = "Down";
Direction[Direction["Left"] = 3] = "Left";
Direction[Direction["Right"] = 4] = "Right";
})(Direction || (Direction = {}));
```
而 `const enum` 则在编译时被完全移除,其成员值会被直接内联到使用它们的地方。这可以减少生成的代码量并提高性能,因为运行时不存在实际的枚举对象。例如:
```typescript
const enum Direction {
Up = 1,
Down,
Left,
Right
}
```
在使用 `const enum` 成员的地方,如 `let direction = Direction.Up;`,编译后的 JavaScript 会直接变成 `let direction = 1 /* Up */;`。这种方式避免了创建额外的对象,也避免了在运行时进行属性查找的成本[^2]。
然而,`const enum` 的使用也有一些限制。由于它们在编译时被内联,因此不能使用计算值,也不能在运行时动态访问枚举成员。如果尝试这样做,TypeScript 编译器会报错。此外,`const enum` 不支持反向映射,即不能通过值来获取键名[^4]。
关于 Vue 3 源码中为何不建议使用 `const enum`,主要是因为 `const enum` 的内联特性可能导致调试困难,以及在某些复杂的模块化场景中可能引起的问题。普通 `enum` 由于其运行时存在的特性,可能在调试和动态访问时更加灵活和方便[^1]。
综上所述,在选择使用 `enum` 还是 `const enum` 时,应根据具体需求权衡其优缺点。如果需要在运行时动态访问枚举成员或进行调试,普通 `enum` 可能是更好的选择;如果更关注性能和代码体积,则可以选择 `const enum`[^3]。
阅读全文
相关推荐




















