TypeScript-枚举

寻觅~流光2025-07-042025-07-06

TypeScript-枚举

枚举

枚举是 TypeScript 中一个重要的概念，它可以帮助我们定义一组命名常量，并为每个常量赋予一个数值。枚举可以让我们更方便地管理代码中的常量，并减少代码中的魔法数字。

TypeScript 中的枚举语法如下：

1	enum Color {Red, Green, Blue}

上面的代码定义了一个名为 Color 的枚举，它包含三个常量 Red、Green 和 Blue，每个常量都被赋予一个数值，默认情况下，数值从 0 开始递增。

我们可以像这样使用枚举：

1 2	let color: Color = Color.Red; console.log(color); // 0

上面的代码声明了一个变量 color，它的类型是 Color，并赋值为 Color.Red。由于 Color.Red 的值是 0，因此 color 的值为 0。

我们也可以通过枚举的属性来访问枚举中的值：

1
2
3

console.log(Color.Red); // 0
console.log(Color.Green); // 1
console.log(Color.Blue); // 2

上面的代码分别访问了 Color.Red、Color.Green 和 Color.Blue 的值。

常量枚举

常量枚举是指编译阶段就能够确定的值，而不是在运行时才能确定的枚举。常量枚举可以让我们在编译时就能获知枚举的所有成员，并在代码中引用它们。

常量枚举的语法如下：

1	const enum Color {Red, Green, Blue}

常量枚举与普通枚举的区别在于，它在编译阶段就能确定枚举的所有成员，因此编译后的代码中不会生成额外的代码。

常量枚举的用途主要有以下几点：

防止命名冲突：常量枚举可以防止命名冲突，因为编译器会确保所有引用枚举的地方都使用了相同的常量值。
减少打包体积：常量枚举可以减少打包体积，因为编译器会把所有引用枚举的地方都替换为常量值，而不会生成额外的代码。
防止意外修改：常量枚举可以防止意外修改，因为编译器会确保所有引用枚举的地方都使用了相同的常量值。

枚举成员类型

枚举成员类型是指枚举成员的值的类型。TypeScript 允许我们为枚举成员指定类型，这样可以帮助我们更好地理解枚举的含义。

枚举成员类型语法如下：

1	enum Color {Red = 1, Green, Blue = "3"}

上面的代码定义了一个名为 Color 的枚举，它包含三个常量 Red、Green 和 Blue，每个常量都被赋予一个数值。

Red 的值是 1，Green 的值是 2，Blue 的值是 “3”。

我们也可以为枚举成员指定类型：

1	enum Color {Red = "1" as number, Green, Blue = "3" as number}

上面的代码为 Red、Green 和 Blue 成员指定了类型。

Red 的值是 1，Green 的值是 2，Blue 的值是 3。

枚举成员的计算

枚举成员的计算是指枚举成员的值是由其他枚举成员的值计算得到的。TypeScript 允许我们在枚举成员的值中使用其他枚举成员的值。

枚举成员的计算语法如下：

1	enum Color {Red = 1, Green = Red + 1, Blue = Green + 1}

上面的代码定义了一个名为 Color 的枚举，它包含三个常量 Red、Green 和 Blue，每个常量都被赋予一个数值。

Green 的值是 Red 的值加 1，Blue 的值是 Green 的值加 1。

枚举成员的联合

枚举成员的联合是指枚举成员的值可以是多个不同类型的值。TypeScript 允许我们将多个枚举成员的值合并到一个枚举中。

枚举成员的联合语法如下：

enum Color {Red, Green, Blue}
enum Color1 {Red, Green, Blue}

type ColorUnion = Color | Color1;

上面的代码定义了两个名为 Color 和 Color1 的枚举，它们包含三个常量 Red、Green 和 Blue。

我们还定义了一个名为 ColorUnion 的类型，它是 Color 和 Color1 的联合。

1	let color: ColorUnion = Color.Red;

上面的代码声明了一个变量 color，它的类型是 ColorUnion，并赋值为 Color.Red。由于 Color.Red 的值是 0，因此 color 的值为 0。

枚举成员的反向映射

枚举成员的反向映射是指枚举成员的值可以映射到枚举成员的名称。TypeScript 允许我们通过枚举成员的值来获取枚举成员的名称。

枚举成员的反向映射语法如下：

1
2
3

enum Color {Red, Green, Blue}

const colorName = Color[0]; // "Red"

上面的代码定义了一个名为 Color 的枚举，它包含三个常量 Red、Green 和 Blue。

我们可以通过枚举成员的值来获取枚举成员的名称。

1	console.log(colorName); // "Red"

上面的代码通过 Color[0] 来获取 Color.Red 的名称，并打印出来。

枚举成员的常量属性

枚举成员的常量属性是指枚举成员的值是常量，不能被修改。TypeScript 允许我们将枚举成员的常量属性设置为 true。

枚举成员的常量属性语法如下：

enum Color {Red = 1, Green = 2, Blue = 3}

const enum Color1 {Red = 1, Green = 2, Blue = 3}

const enum Color2 {Red = 1, Green = 2, Blue = 3} as const

上面的代码定义了三个枚举，它们包含三个常量 Red、Green 和 Blue。

Color 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color1 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color2 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

枚举成员的常量方法

枚举成员的常量方法是指枚举成员的值是常量，不能被修改。TypeScript 允许我们将枚举成员的常量方法设置为 true。

枚举成员的常量方法语法如下：

enum Color {Red = 1, Green = 2, Blue = 3}

const enum Color1 {Red = 1, Green = 2, Blue = 3}

const enum Color2 {Red = 1, Green = 2, Blue = 3} as const

const enum Color3 {Red = 1, Green = 2, Blue = 3} as const {
  getColor() {
    return this.valueOf();
  }
}

上面的代码定义了三个枚举，它们包含三个常量 Red、Green 和 Blue。

Color 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color1 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color2 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color3 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color3 还定义了一个名为 getColor 的常量方法，它返回枚举成员的值。

枚举成员的常量类

枚举成员的常量类是指枚举成员的值是常量，不能被修改。TypeScript 允许我们将枚举成员的常量类设置为 true。

枚举成员的常量类语法如下：

enum Color {Red = 1, Green = 2, Blue = 3}

const enum Color1 {Red = 1, Green = 2, Blue = 3}

const enum Color2 {Red = 1, Green = 2, Blue = 3} as const

const enum Color3 {Red = 1, Green = 2, Blue = 3} as const {
  getColor() {
    return this.valueOf();
  }
}

class Color4 {
  static readonly Red = 1;
  static readonly Green = 2;
  static readonly Blue = 3;
}

const enum Color5 {Red = Color4.Red, Green = Color4.Green, Blue = Color4.Blue}

上面的代码定义了三个枚举，它们包含三个常量 Red、Green 和 Blue。

Color 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color1 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color2 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color3 的 Red、Green 和 Blue 成员的值都是常量，不能被修改。

Color3 还定义了一个名为 getColor 的常量方法，它返回枚举成员的值。

Color4 是一个常量类，它包含三个常量 Red、Green 和 Blue。

Color5 是一个常量枚举，它包含三个常量 Red、Green 和 Blue，它们的值都是 Color4 的常量属性。