持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第14天，点击查看活动详情

在TS中 enum(枚举) 和 const enum(常量枚举) 有什么区别？

在回答这个问题之前，我们需要先理解一下：

什么是 enum(枚举)

枚举是组织收集有关联变量的一种方式，许多程序语言（如：c/c#/Java）都有枚举数据类型。摘抄来自官方文档的话：

使用枚举我们可以定义一些带名字的常量。使用枚举可以清晰地表达意图或创建一组有区别的用例。 TypeScript支持数字的和基于字符串的枚举。

目前我自己的话，实际工作中用到的比较多的可能就是：

我们将数字类型赋值给枚举类型

enum Demo {
  a = 1,
  b = 2,
  c = 3
}
let test = Demo.a

如上，我们定义了一个数字枚举Demo，然后分别为：a、b、c 进行了赋值。
换句话说， Demo.a的值为 1， b为 2， c为 3。
当然，我们还可以设置为自增

enum Demo {
  a = 2,
  b,
  c
}
let test = Demo.a

这样：Demo.a的值为 2， b为 3， c 为 4。

字符串枚举的概念很简单，但是有细微的运行时的差别。在一个字符串枚举里，每个成员都必须用字符串字面量，或另外一个字符串枚举成员进行初始化。

enum Demo {
  a = 'a',
  b =  'b',
  c = 'c'
}
let test = Demo.a

混合字符串和数字成员,但是我觉得这样做实在是。。。。不太行，借用来自官网的一句话

除非你真的想要利用JavaScript运行时的行为，否则我们不建议这样做。

enum Demo {
    a = 0,
    b = "YES",
}

const enum Demo1 {
  A = 'a',
  B = 'b',
}

enum Demo2 {
  A = 'a',
  B = 'b',
}

如图，我们可以看见，最终的编译结果就只有 Demo2 这个普通枚举的 2. 常量枚举不支持动态计算

const d = 111
const enum Demo1 {
  A = d * 1,
  B = d * 2,
}

enum Demo2 {
  A = d * 1,
  B = d * 2,
}

当然这也是因为常量枚举编译的特性，所以导致他不支持动态变量的计算：

当然，枚举内部的常量可以，因为枚举内部的常量支持自动推导。