解释 TypeScript 中的枚举

typescriptserver side programmingprogramming

在了解"枚举"之前,了解 TypeScript 中流行的关键字"const"至关重要。当我们声明变量"const"时,我们不能改变赋给它的值。

因此,枚举不过是这些 const 数据类型的集合。我们可以借助"enum"关键字创建枚举。枚举是枚举的缩写,枚举下声明的每个常量变量都称为该枚举的成员。

在本文中,我们将了解 TypeScript 中的枚举、它们的特性以及枚举的主要类型。

TypeScript 中枚举的特性

  • TypeScript 中的枚举具有令人惊讶的特性。如果我们不为枚举的成员变量分配任何重要性,则枚举的成员变量将其索引值作为默认值。

  • 枚举的每个成员都必须包含一个值。我们可以分配一个常量,也可以从函数中计算出一个值。如果上述情况都不是,枚举成员将存储默认常量值。

  • 枚举成员也可以用常量表达式赋值。TypeScript 中的任何常量表达式都是在编译时而不是运行时进行评估的。

  • 枚举可以作为参数传递给函数,通过函数计算并返回给函数。

  • TypeScript 中的枚举支持反向映射的概念。通过反向映射,我们可以从其值访问成员,并从其索引成员访问值。这个概念背后的想法是,枚举对象在内部以两种方式存储成员,即其变量引用值和值引用枚举变量。由于typescript一般会将代码转换为javascript,所以它支持反向映射。

  • 字符串枚举不支持反向映射;在异构枚举中,只有数字枚举支持反向映射。

  • const枚举类型在编译时被移除,并被它们的值替换。因此,const枚举比普通枚举更快,减少了在编译时生成额外代码的复杂性。但我们只能在const枚举中使用常量成员,不能使用计算成员。

枚举的类型

数字枚举

在这种类型的枚举中,枚举的成员被分配数字值。数字枚举具有自动递增的特性。例如,如果我们将数字 5 分配给枚举的第一个常量变量,则以下常量变量的值将以 1 为增量进行分配,例如将 6 分配给枚举的第二个成员,将 7 分配给下一个成员,依此类推。

示例

在下面的示例中,我们创建了一个名为 color 的枚举类型。在 color 中,创建了四个 const 变量,名称分别为 red、blue、yellow 和 pink。为了演示数字枚举的自动递增特性,我们将值分配给前两个 const 变量,并保留其他两个变量的默认值。让我们在输出中查看它们的默认值。

//enum type color
enum color{
   //分配数值
   red = 1,
   blue = 3,
   pink,
   yellow
}
//打印 const 变量值
console.log(color.red);
console.log(color.blue);
console.log(color.pink);
console.log(color.yellow);

编译时,将生成以下 JavaScript 代码:

//enum type color
var color;
(function (color) {
   //assign numeric value
   color[color["red"] = 1] = "red";
   color[color["blue"] = 3] = "blue";
   color[color["pink"] = 4] = "pink";
   color[color["yellow"] = 5] = "yellow";
})(color || (color = {}));
//打印 const 变量值
console.log(color.red);
console.log(color.blue);
console.log(color.pink);
console.log(color.yellow);

输出

上述代码将产生以下输出 −

1
3
4
5

正如用户在输出中注意到的,blue之后的const变量为自己分配了默认值,即增加1。

字符串枚举

IString枚举与数字枚举类似,不同之处在于字符串枚举的值是使用字符串而不是数字值分配的。字符串枚举不具备自动递增行为。

示例

在下面的示例中,我们创建了一个名为"names"的字符串类型枚举。在创建的枚举下,我们声明了四个变量 student1、student2、student3 和 student4。这些变量被赋值为字符串文字。字符串枚举类型中不存储默认字符串值,如果没有赋值,则只存储数字值作为默认值。

enum names{
//分配字符串文字
   student1 = "john",
   student2 = "srujana",
   student3 = "sam",
   student4 = "ram"
}
//打印 const 变量值
console.log(names.student1);
console.log(names.student2);
console.log(names.student3);
console.log(names.student4);

编译后,将生成以下 JavaScript 代码:

var names;
(function (names) {
   //assign string literal
   names["student1"] = "john";
   names["student2"] = "srujana";
   names["student3"] = "sam";
   names["student4"] = "ram";
})(names || (names = {}));
//打印 const 变量值
console.log(names.student1);
console.log(names.student2);
console.log(names.student3);
console.log(names.student4);

输出

上述代码将产生以下输出 −

john
srujana
sam
ram

用户在输出中可以注意到,前三个枚举变量是字符串类型。因此,这是一个字符串类型的枚举。

异构枚举

这是数字和字符串枚举的组合。也就是说,在这种类型的枚举中,我们可以为其成员分配字符串值或数字值。

示例

在下面的示例中,我们创建了一个 student 类型的枚举。student 内部有四个 const 变量:name、roll_no、gender 和 mob_no。 Name 和 gender 是字符串类型,roll_no 和 mob_no 是数值类型。

//enum type student
enum student{
    //分配字符串文字
    name = "srujana",
    roll_no = 15,
    gender = "female",
    mob_no = 9873890414
}
console.log(student.name);
console.log(student.roll_no);
console.log(student.gender);
console.log(student.mob_no);

编译后会生成如下 JavaScript 代码:

//枚举类型学生
var student;
(function (student) {
    //分配字符串文字
    student["name"] = "srujana";
    student[student["roll_no"] = 15] = "roll_no";
    student["gender"] = "female";
    student[student["mob_no"] = 9873890414] = "mob_no";
})(student || (student = {}));
console.log(student.name);
console.log(student.roll_no);
console.log(student.gender);
console.log(student.mob_no);

输出

上述代码将产生以下输出 -

srujana
15
female
9873890414

在本文中,用户了解了 TypeScript 关键字"enum"。其功能和类别得到了很好的解释,并且还分享了讨论的每种枚举类型的示例。


相关文章