TypeScript 中的枚举和常量枚举

阅读时长 4 分钟读完

在前端开发中,经常需要处理一些固定的值集合,比如性别、星期几、颜色等等。使用枚举可以方便地定义这些值集合,使代码更具可读性和可维护性。

枚举

枚举是一种用户定义的类型,它包含一组命名的值。在 TypeScript 中,枚举可以使用 enum 关键字来定义,如下所示:

上面的代码定义了一个名为 Gender 的枚举,它包含三个值分别为 MaleFemaleOther。这些值可以通过枚举名来引用,例如:

因为枚举值是按照从 0 开始的自然顺序逐个递增的,所以上面的代码输出的是 0。如果需要手动指定枚举值,可以在值后面使用等号进行赋值,例如:

-- -------------------- ---- -------
---- ------- -
  ------ - --
  --------
  ----------
  ---------
  -------
  ---------
  ------
-

上面的代码定义了一个名为 Weekday 的枚举,它包含七个值,分别为 1、2、3、4、5、6 和 7。其中第一个枚举值被手动指定为 1,后面的枚举值按照递增的方式自动计算。

在 TypeScript 中,枚举值可以是任意类型,不仅仅是数字。例如:

上面的代码定义了一个名为 Color 的枚举,它包含三个值,分别为红、绿和蓝,对应的值分别为 "#ff0000"、"#00ff00" 和 "#0000ff"。这样可以在代码中方便地引用颜色值,提高代码的可读性和可维护性。

常量枚举

在运行时,枚举值会被编译成实际的值,这会增加代码大小并降低运行效率。如果枚举中的值不需要在运行时使用,那么可以使用常量枚举来避免这个问题。

常量枚举是一种特殊的枚举,它不会被编译成实际的值,而是在编译时被替换为相应的值。常量枚举使用 const enum 关键字来定义,例如:

上面的代码定义了一个名为 Direction 的常量枚举,它包含四个值,分别为上、下、左和右。在编译时,这些值会直接被替换为相应的数字。因此,常量枚举不支持手动指定枚举值。

需要注意的是,常量枚举只能包含常量枚举表达式。常量枚举表达式是指 TypeScript 中可以在编译时计算出结果的表达式,例如字面量、简单的算术运算和引用其他常量枚举值等。如果常量枚举包含非常量枚举表达式,会导致编译错误。

总结

枚举是一种方便处理固定值集合的用户定义类型,可以提高代码的可读性和可维护性。常量枚举是一种特殊的枚举,不会被编译成实际的值,可以减小代码大小和提高运行效率。在实际开发中,应根据需求选择适合的枚举类型。

示例代码

下面是一个使用枚举和常量枚举的示例代码,它定义了一个名为 Person 的接口,包含姓名、年龄、性别和血型四个属性,分别使用了枚举和常量枚举来定义。

-- -------------------- ---- -------
---- ------ -
  -----
  -------
  -----
-

----- ---- --------- -
  --
  --
  ---
  -
-

--------- ------ -
  ----- -------
  ---- -------
  ------- -------
  ---------- ----------
-

--- ------- ------ - -
  ----- -----
  ---- ---
  ------- ------------
  ---------- -----------
--

--------------------

执行上面的代码,会输出以下结果:

其中 genderbloodType 分别对应枚举 Gender 和常量枚举 BloodType 中的第一个值。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6501a49995b1f8cacdf50539

纠错
反馈