Typescript 枚举

枚举标志性动做是使用关键字 enum 来定义类型。好比

// enum.ts
enum Friends {张三, 李四, 王五};
复制代码

// enum2.ts
enum Friends2 {张三, 李四, 王五};
console.log(Friends2[0] === '张三')
console.log(Friends2['张三'] === 0)
复制代码

编译后

// enum2.js
var Friends2;
(function (Friends2) {
    Friends2[Friends2["\u5F20\u4E09"] = 0] = "\u5F20\u4E09";
    Friends2[Friends2["\u674E\u56DB"] = 1] = "\u674E\u56DB";
    Friends2[Friends2["\u738B\u4E94"] = 2] = "\u738B\u4E94";
})(Friends2 || (Friends2 = {}));
;
console.log(Friends2[0] === '张三'); // true
console.log(Friends2['张三'] === 0); // true
复制代码

可见，枚举能够可用下标索引获取值，另外枚举的 key 和 value 可反向映射。

手动赋值

// enum3.ts
enum Friends3 { 张三 = 30, 李四 = 18, 王五 };
console.log(Friends3['张三'] === 30);
console.log(Friends3['李四'] === 18);
console.log(Friends3['王五'] === 19);

enum Friends3_1 { 张三 = '30', 李四 = '18', 王五 = '9' };
enum Friends3_2 { 张三 = '30', 李四 = '18', 王五 = 9 };
enum Friends3_3 { 张三 = '30', 李四, 王五 };

// 0.0.8/enum3.ts:8:30 - error TS1061: Enum member must have initializer.
    // 8 enum Friends3_3 { 张三 = '30', 李四, 王五 };
                               ~~
// 0.0.8/enum3.ts:8:34 - error TS1061: Enum member must have initializer.
    // 8 enum Friends3_3 { 张三 = '30', 李四, 王五 };
复制代码

编译后

// enum3.js
var Friends3;
(function (Friends3) {
    Friends3[Friends3["\u5F20\u4E09"] = 30] = "\u5F20\u4E09";
    Friends3[Friends3["\u674E\u56DB"] = 18] = "\u674E\u56DB";
    Friends3[Friends3["\u738B\u4E94"] = 19] = "\u738B\u4E94";
})(Friends3 || (Friends3 = {}));
;
console.log(Friends3['张三'] === 30);
console.log(Friends3['李四'] === 18);
console.log(Friends3['王五'] === 19);
var Friends3_1;
(function (Friends3_1) {
    Friends3_1["\u5F20\u4E09"] = "30";
    Friends3_1["\u674E\u56DB"] = "18";
    Friends3_1["\u738B\u4E94"] = "9";
})(Friends3_1 || (Friends3_1 = {}));
;
var Friends3_2;
(function (Friends3_2) {
    Friends3_2["\u5F20\u4E09"] = "30";
    Friends3_2["\u674E\u56DB"] = "18";
    Friends3_2[Friends3_2["\u738B\u4E94"] = 9] = "\u738B\u4E94";
})(Friends3_2 || (Friends3_2 = {}));
;
var Friends3_3;
(function (Friends3_3) {
    Friends3_3["\u5F20\u4E09"] = "30";
    Friends3_3[Friends3_3["\u674E\u56DB"] = void 0] = "\u674E\u56DB";
    Friends3_3[Friends3_3["\u738B\u4E94"] = void 0] = "\u738B\u4E94";
})(Friends3_3 || (Friends3_3 = {}));
;
复制代码

说一下

• 赋值是数字，能够部分赋值；
• 赋值中有一个是字符串，得全部成员都赋值；

问：若是值手动赋值一个字符串怎么办？

// enum4.ts
enum Friends4 { 张三 = '30', 李四, 王五 };
enum Friends4_1 { 张三 = <any>'30', 李四, 王五 };
enum Friends4_2 { 张三, 李四 = <any>'30', 王五 };
enum Friends4_3 { 张三, 李四 = <any>'30', 王五 = '30' };
enum Friends4_4 { 张三, 李四, 王五 = <any>'30' };
enum Friends4_5 { 张三, 李四 = <any>'30', 王五 = <any>'30' };
enum Friends4_6 { 张三, 李四 = <any>'30', 王五 = 30 };


// 0.0.8/enum4.ts:1:28 - error TS1061: Enum member must have initializer.
    // 1 enum Friends4 { 张三 = '30', 李四, 王五 };
// 0.0.8/enum4.ts:1:32 - error TS1061: Enum member must have initializer.
    // 1 enum Friends4 { 张三 = '30', 李四, 王五 };
                                 ~~

// 0.0.8/enum4.ts:2:35 - error TS1061: Enum member must have initializer.
    // 2 enum Friends4_1 { 张三 = <any>'30', 李四, 王五 };
// 0.0.8/enum4.ts:2:39 - error TS1061: Enum member must have initializer.
    // 2 enum Friends4_1 { 张三 = <any>'30', 李四, 王五 };
                                        ~~
// 0.0.8/enum4.ts:3:39 - error TS1061: Enum member must have initializer.
    // 3 enum Friends4_2 { 张三, 李四 = <any>'30', 王五 };
                                        ~~
// 0.0.8/enum4.ts:4:28 - error TS2553: Computed values are not permitted in an enum with string valued members.
    // 4 enum Friends4_3 { 张三, 李四 = <any>'30', 王五 = '30' };
复制代码

上面，例子说明下

• 第 1 行报错，是由于只给第一个成员赋值字符串，其余成员没有赋值;
• 第 2-3 行报错，是由于类型断言<any> 后面还有成员赋值;
• 第 4 行报错，是由于类型断言<any> 后面赋值不是数字;
• 剩余几行没报错，是由于类型断言<any> 后面的成员都赋值了（并且）;

总结

• 赋值是字符串，得所有都赋值；
• 赋值部分为字符串，得用类型断言，类型断言后面不能有赋值为字符串的成员；

深深地知道还有不少复杂的场景没有列出来，本篇除了简单对枚举有个介绍外，还但愿可以让在学 Typescript 的伙伴意识到触类旁通和自我思考的重要性（若是达到了，那说明本篇文章的价值真正体现出来了）。固然对于其余场景，在之后的时间里，一旦碰到仍是会更新到本篇文章里，不断完善和自我完善（一个合格程序员的自我休养）。

本次代码 Github

你能够...

上一篇：Typescript 元祖

下一篇：Typescript 类

目录：Typescript 小书之入门篇