TypeScript中Enum類型的具體使用
1. Enum類型簡介
Enum是ts新增的一種數(shù)據(jù)結(jié)構(gòu)和類型,稱為枚舉。
相當(dāng)于一個容器,用來存放常量,因為開發(fā)中經(jīng)常需要定義一組相關(guān)的常量。使用時就跟對象屬性寫法一樣。
enum Color { Red, // 0 Green, // 1 Blue // 2 } let c = Color.Green; // 1 // 等同于 let c = Color['Green']; // 1 let c:Color = Color.Green; // 正確 let c:number = Color.Green; // 正確
Enum 結(jié)構(gòu)本身也是一種類型。比如,上例的變量c
等于1
,它的類型可以是 Color,也可以是number
。
Enum 結(jié)構(gòu)的特別之處在于,它既是一種類型,也是一個值。絕大多數(shù) ts 語法都是類型語法,編譯后會全部去除,但是 Enum 結(jié)構(gòu)是一個值,編譯后會變成 JavaScript 對象,留在代碼中。
// 編譯前 enum Color { Red, // 0 Green, // 1 Blue // 2 } // 編譯后 let Color = { Red: 0, Green: 1, Blue: 2 };
Enum結(jié)構(gòu)編譯后是一個對象,所以不能有同名的對象、函數(shù)和類等。
2. Enum成員的值
Enum 成員默認(rèn)不必賦值,系統(tǒng)會從零開始逐一遞增,按照順序為每個成員賦值,比如0、1、2……也可以為 Enum 成員顯式賦值,可以是任意數(shù)值,但不能是大整數(shù)(Bigint)。
成員的值可以相同。如果只設(shè)置第一個成員的值,后面的成員的值默認(rèn)遞增。成員的值也可以使用計算式。所有成員的值都是只讀的,不能修改。
因為成員的值不能修改,所以可以加上const修飾,表示常量,加上const編譯后不會轉(zhuǎn)成對象,而是變成對應(yīng)的常量。如果加上const,還想轉(zhuǎn)成對象,可以將編譯選項preserveConstEnums打開。
const enum Color { Red, Green, Blue } const x = Color.Red; const y = Color.Green; const z = Color.Blue; // 編譯后 const x = 0 /* Color.Red */; const y = 1 /* Color.Green */; const z = 2 /* Color.Blue */;
3. 同名Enum的合并
就是多個同名的Enum結(jié)構(gòu)會自動合并
enum Foo { A, } enum Foo { B = 1, } enum Foo { C = 2, } // 等同于 enum Foo { A, B = 1, C = 2 }
合并規(guī)則
- 只允許其中一個的首成員省略初始化,否則會報錯,就是多個同名的,只能有一個的首成員可以省略初始值,其他的首成員必須初始化值,對于不是首成員的不管。
- 合并時不能有同名成員,否則報錯
- 必須同為const或這沒有const,不能混合
特點(diǎn):補(bǔ)充外部定義的Enum結(jié)構(gòu)
4. 字符串Enum
Enum成員不僅可以設(shè)為數(shù)值,也能設(shè)為字符串。也就是一組相關(guān)的字符串集合。
對于字符串枚舉的成員必須定義值,要是不定義值默認(rèn)為數(shù)值,并且需要在顯示設(shè)置的值的成員前面。
成員可以是字符串也是數(shù)值,不允許使用其他類型的值。
如果變量類型是字符串Enum,就不能在進(jìn)行賦值為字符串,跟數(shù)值Enum不一樣。
enum MyEnum { One = 'One', Two = 'Two', } let s = MyEnum.One; s = 'One'; // 報錯
因為變量類型為字符串Enum時,不能再進(jìn)行修改,所以如果函數(shù)的參數(shù)類型是字符串Enum時,直接傳入字符串會報錯,可以起到限定函數(shù)參數(shù)的作用。
字符串Enum的成員值不能使用表達(dá)式賦值。
enum MyEnum { A = 'one', B = ['T', 'w', 'o'].join('') // 報錯 }
5. keyof運(yùn)算符
keyof運(yùn)算符可以取出Enum結(jié)構(gòu)的所有成員名,返回聯(lián)合類型。
在使用的使用必須使用typeof,因為Enum類型本質(zhì)是number和string的一種變體。如果不使用typeof就相當(dāng)于keyof number,而有了typeof,typeof會把一個值轉(zhuǎn)為對象類型,然后keyof運(yùn)算符返回該對象的所有屬性名。
enum MyEnum { A = 'a', B = 'b' } // 'A'|'B' type Foo = keyof typeof MyEnum;
如果要返回Enum所有的成員值,可以使用in運(yùn)算符
enum MyEnum { A = 'a', B = 'b' } // { a: any, b: any } type Foo = { [key in MyEnum]: any };
6. 反向映射
對于數(shù)值Enum可以通過成員值獲得成員名。
enum Weekdays { Monday = 1, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday } console.log(Weekdays[3]) // Wednesday
到此這篇關(guān)于TypeScript中Enum類型的具體使用的文章就介紹到這了,更多相關(guān)TypeScript Enum類型內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
微信小程序picker組件簡單用法示例【附demo源碼下載】
這篇文章主要介紹了微信小程序picker組件簡單用法,結(jié)合實例形式詳細(xì)分析了picker組件的功能、使用方法與相關(guān)注意事項,需要的朋友可以參考下2017-12-12electronjs實現(xiàn)打開的網(wǎng)頁密碼自動保存功能(實現(xiàn)步驟)
在 Electron 的渲染進(jìn)程中,可以使用 webContents 對象來監(jiān)聽網(wǎng)絡(luò)請求,在 Electron 中實現(xiàn)自動保存網(wǎng)頁密碼的功能涉及到幾個步驟,下面給大家分享實現(xiàn)思路,感興趣的朋友跟隨小編一起看看吧2024-08-08JavaScript實現(xiàn)計算字符串中出現(xiàn)次數(shù)最多的字符和出現(xiàn)的次數(shù)
這篇文章主要介紹了JavaScript實現(xiàn)計算字符串中出現(xiàn)次數(shù)最多的字符和出現(xiàn)的次數(shù),本文直接給出實現(xiàn)代碼,需要的朋友可以參考下2015-03-03