枚举数据类型
枚举数据类型是TypeScript
对JavaScript的数据结构的拓展
,在原生的JavaScript中是不存在枚举数据类型的
,枚举数据用于表示固定的几个变量
,只要外部的变量使用了定义好的枚举数据,那么这个外部的变量的值只能在该枚举数据中选择
通过
enum
关键字定义枚举数据-
enum 数据名称 { 变量名称1, 变量名称2 }
enum Gender { Male, Femal } // 外部变量绑定枚举数据 let value1:Gender let value2:Gender // 对外部变量进行初始化 value1 = Gender.Male value2 = Gender.Femal console.log(value1) // 0 console.log(value2) // 1
-
外部变量绑定枚举数据,那么外部变量的值只能在该枚举数据中选择,否则编译器就会报错
enum Gender { Male, Femal } let val:Gender; val = 'abc'; // 编译器报错
-
枚举数据中的变量底层本质其实就是数字类型,从上至下开始,默认是从0开始递增的
enum Gender { Male, Female, Simon } console.log(Gender.Male); // 0 console.log(Gender.Female); // 1 console.log(Gender.Simon); // 2
-
虽然枚举数据中的变量值默认是从0开始递增的,但是我们也可以手动的指定某个枚举变量的值,如果手动指定了某个枚举变量的值,那么后面枚举变量的值就会根据上面邻近的被修改过的枚举变量的取值进行递增
enum letter { a, b, c = 6, d, e, f = 14, g, h, } console.log(letter.a); // 0 console.log(letter.b); // 1 console.log(letter.c); // 6 console.log(letter.d); // 7 console.log(letter.e); // 8 console.log(letter.f); // 14 console.log(letter.g); // 15 console.log(letter.h); // 16
-
可以通过枚举变量的名称拿到它对应的取值,也可以通过它对应的取值拿到它的枚举变量的名称,这是就是反向映射
enum Gender { Male = 4, Female, Simon = 8 } console.log(Gender.Male); // 4 console.log(Gender[4]); // Male console.log(Gender.Female); // 5 console.log(Gender[5]); // Female console.log(Gender[8]); // Simon
-
因为枚举数据中变量的底层实现的本质是数字类型,所以外部虽然绑定了该枚举数据,但是外部变量随机赋值一个数字类型的取值依然不会报错
enum Gender { Male, Female } let val:Gender val = 6; // 没有报错
-
某个枚举变量的取值也可以是计算属性,如果使用了计算属性,那么该计算属性后面的枚举变量的取值必须手动赋值,不然会报错
enum letter { a, b, c = getSum(1, 3), // 可以使用计算属性 d = 5, // 但是计算属性之后的枚举值需要手动赋值,它不能自动计算,如果不进行手动赋值,那么后面的枚举值不能自动计算,编译器报错 e, f, g, h, } console.log(letter.a); // 0 console.log(letter.b); // 1 console.log(letter.c); // 4 console.log(letter.d); // 5 console.log(letter.e); // 6 console.log(letter.f); // 7 console.log(letter.g); // 8 console.log(letter.h); // 9 function getSum(a:number, b:number):number { return a + b; }
-
枚举数据类型底层实现原理(简单)
let Gender; (function (Gender) { // Gender[key] = value; Gender[Gender["Male"] = 0] = "Male"; Gender[Gender["Femal"] = 1] = "Femal"; })(Gender || (Gender = {})); let Gender = {}; Gender["Male"] = 0; Gender[0] = "Male"; Gender["Femal"] = 1; Gender[1] = "Femal"; enum Gender { Male, Female }
枚举数据类型的分类
- 数字枚举数据:枚举数据中变量的值全部都是由数字组成的
- 字符串枚举数据:枚举数据中变量的值全部都是由字符串组成的
- 异构枚举数据:枚举数据中变量的值全部都是由数字或者字符串组成的
数字number
枚举
(上面讲解的就是数字枚举)
-
数字枚举变量的取值除了是通过
计算属性返回的number数值
,也可以是const定义number数值
,也可以是其它的变量中保存的number数值
let arr:any[] = [8, 'b'] const num = 1 enum letter { a = arr[0], // 其它的变量中保存的number数值 b = num, // const定义number数值 c = 6, d = getSum(5, 5), // 计算属性返回的number数值 e = 7, f, g = 100, h, } function getSum(a:number, b:number):number { return a + b; } console.log(letter.a) console.log(letter.b) console.log(letter.c) console.log(letter.d) console.log(letter.e) console.log(letter.f) console.log(letter.g) console.log(letter.h)
字符串string
枚举
-
变量的取值不能根据前面自动计算,字符串枚举数据的变量应该全部手动赋值
enum Gender { Male = "123", Female = '456' }
-
不能通过变量的值获取枚举变量的名称
enum Gender { Male = "123", Female = '456' } console.log(Gender['123']) // undefined console.log(Gender['456']) // undefined
-
变量的取值不能是通过
计算属性返回的string的数值
,也不能是通过const定义的string数值
,也不能是其它变量中保存string数值
let arr:any[] = [8, 'b'] const str = 'zs' enum letter { a = arr[1], // 报错 b = str, // 报错 d = getStr('lnj', '26'), // 报错 e = 'ls', } function getStr(a:string, b:string):string { return a + b; } console.log(letter.a) console.log(letter.b) console.log(letter.d) console.log(letter.e)
异构枚举
-
枚举数据中的变量取值既包含
number
类型又包含string
类型enum Gender { Male = 6, Female = '456' }
枚举数据的总结
- 其实在一个枚举数据使用要求中,没有强调枚举数据的变量的数值必须是同一个数据类型。也就是说,异构枚举数据使用的频率更高
- 在对枚举数据的变量进行手动赋值过程中,如果是赋的值是
number
类型,那么这个数值可以是直接定义的number
数值,也可以是通过计算属性得到的number
数值,也可以是其它变量中保存的number
数值 - 在对枚举数据的变量进行手动赋值过程中,如果是赋的值是
string
类型,那么这是数值只能是直接定义的string
数值,不能是外部变量或者常量中保存的string
数值 - 枚举数据中的变量的数值可以自动计算,但也只能是计算
number
的数值。它只能根据上一个的number
类型的数值进行计算,假如上一个不是number
的数值,那么他就无法计算,需要手动赋值一个number
的数值,才能不影响后面的枚举变量的数值,这在异构枚举中颇为重要