TypeScript中列舉型別的理解與應用場景
目錄
- 一、是什麼
- 二、使用
- 數字列舉
- 字串列舉
- 異構列舉
- 本質
- 三、應用場景
- 總結
一、是什麼
列舉是一個被命名的整型常數的集合,用於宣告一組命名的常數,當一個變數有幾種可能的取值時,可以將它定義為列舉型別
通俗來說,列舉就是一個物件的所有可能取值的集合
在日常生活中也很常見,例如表示星期的SUNDAY、MONDAY、TUESDAY、WEDNESDAY、THURSDAY、FRIDAY、SATURDAY就可以看成是一個列舉
列舉的說明與結構和聯合相似,其形式為:
enum 列舉名{
識別符號①[=整型常數],
識別符號②[=整型常數],
...
標識www.cppcns.com符N[=整型常數],}列舉變數;
二、使用
列舉的使用是通過enum關鍵字進行定義,形式如下:
enum xxx { ... }
宣告關鍵字為列舉型別的方式如下:
// 宣告d為列舉型別Direction
let d: DirekSfPBiIction;
型別可以分成:
- 數字列舉
- 字串列舉
- 異構列舉
數字列舉
當我們宣告一個列舉型別是,雖然沒有給它們賦值,但是它們的值其實是預設的數字型別,而且預設從0開始依次累加:
enum Direction { Up,// 值預設為 0 Down,// 值預設為 1 Left,// 值預設為 2 http://www.cppcns.comRight // 值預設為 3 } console.log(Direction.Up === 0); // true console.log(Direction.Down === 1); // true console.log(Direction.Left === 2); // true console.log(Direction.Right === 3); // true
如果我們將第一個值進行賦值後,後面的值也會根據前一個值進行累加1:
enum Direction { Up = 10,Down,Left,Right } console.log(Direction.Up,Direction.Down,Direction.Left,Direction.Right); // 10 11 12 13
字串列舉
列舉型別的值其實也可以是字串型別:
enum Direction { Up = 'Up',Down = 'Down',Left = 'Left',Right = 'Right' } console.log(Direction['Right'],Direction.Up); // Right Up
如果設定了一個變數為字串之後,後續的欄位也需要賦值字串,否則報錯:
enum Direction { Up = 'UP',// error TS1061: Enum member must have initializer Left,// error TS1061: Enum member must have initializer Right // error TS1061: Enum member must have initializer }
異構列舉
即將數字列舉和字串列舉結合起來混合起來使用,如下:
enum BooleanLikeHeterogeneousEnum { No = 0,Yes = "YES",}
通常情況下我們很少會使用異構列舉
本質
現在一個列舉的案例如下:
enum Direction { Up,Right }
通過編譯後,如下:
var Direction; (function (Direction) { Direction[Direction["Up"] = 0] = "Up"; Direction[Direction["Down"] = 1] = "Down"; Direction[Direction["Left"] = 2] = "Left"; Direction[Direction["Right"] = 3] = "Right"; })(Direction || (Direction = {}));
上述程式碼可以看到, Direction[Direction["Up"] = 0] = "Up"可以分成
- Direction["Up"] = 0
- Direction[0] = "Up"
所以定義列舉型別後,可以通過正反對映拿到對應的值,如下:
enum Direction { Up,Right } console.log(Direction.Up === 0); // true console.log(Direction[0]); // Up
並且多處定義的列舉是可以進行合併操作,如下:
enum Direction { Up = 'Up',Right = 'Right' } enum Direction { kSfPBiI Center = 1 }
編譯後,程式碼如下:
var Direction; (function (Direction) { Direction["Up"] = "Up"; Direction["Down"] = "Down"; Direction["Left"] = "Left"; Direction["Right"] = "Right"; })(Direction || (Direction = {})); (function (Direction) { Direction[Direction["Center"] = 1] = "Center"; })(Direction || (Direction = {}));
可以看到,Direction物件屬性回疊加
三、應用場景
就拿回生活的例子,後端返回的欄位使用 0 - 6 標記對應的日期,這時候就可以使用列舉可提高程式碼可讀性,如下:
enum Days {Sun,Mon,Tue,Wed,Thu,Fri,Sat}; console.log(Days["Sun"] === 0); // true console.log(Days["Mon"] === 1); // true console.log(Days["Tue"] === 2); // true console.log(Days["Sat"] === 6); // true
包括後端日常返回0、1 等等狀態的時候,我們都可以通過列舉去定義,這樣可以提高程式碼的可讀性,便於後續的維護
參考文獻
https://zh.wikipedia.org/wiki/%E6%9E%9A%E4%B8%BE
總結
到此這篇關於TypeScript中列舉型別的理解與應用場景的文章就介紹到這了,更多相關TypeScript列舉型別內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!