iT邦幫忙

2021 iThome 鐵人賽

DAY 5
0
自我挑戰組

TypeScript 三十天學習日記系列 第 5

Day 5 基本型別 - part 2

今天要介紹其他的型別,是原本的 JavaScript 沒有的,分別是 Tuple、Enum、Any、Uknown。

Tuple 型別一樣是陣列,不過是定義好陣列內會有幾個元素跟每個元素型別的型別。舉例如下:

type Role = [number, string]
const role: Role = [1, 'FE developer']

Enum 是一種會自動幫你序列化的型別,假設今天在設定登入的角色時,分成 Admin、Read-only、Author,然後用數字來代表各角色時,在 JavaScript 時可能需要各自設定變數才存取,但如果用 Enum 型別會比較方便一些:

enum Role { ADMIN, READ_ONLY, AUTHOR }

https://ithelp.ithome.com.tw/upload/images/20210920/20131989q9D6Lv8nym.png
enum 型別會自動從 0 開始賦值,如果想要自己設定也沒關係:

enum Role { ADMIN = 7, READ_ONLY, AUTHOR }

https://ithelp.ithome.com.tw/upload/images/20210920/20131989atZgEYK4MT.png
ADMIN 設定為 7,後面的變數就會自動序列化下去,如果不想要用數字,也可以設定成字串,總之非常方便的可以客製你自己需要的 Enum 型別。

再來就是 Any 型別,前面有提到這個型別,基本上就是不指定型別 XD!用了這個型別其實就跟用原生的 JavaScript 差不多意思了......,所以真的除非不知道會使用甚麼型別,否則不要輕易使用 Any 型別,因為這樣 TypeScript 就沒辦法幫忙檢查程式碼的型別錯誤了。

如果沒辦法確認變數的型別的話其實還有另一個型別可以用,就是 Unknown,它也是跟 Any 型別一樣能夠接受各種型別,但是比 Any 嚴謹:
https://ithelp.ithome.com.tw/upload/images/20210921/201319892WzMxbWfim.png
這邊可以看到它一樣能夠接受任何型別,但是如果想要把第 2 行的 userName 指派 userInput 的值,即使在第 5 行 userInput 已經重新賦值成字串了卻還是會報錯:
https://ithelp.ithome.com.tw/upload/images/20210921/20131989wVeGWOv46R.png
但是,如果把 userInput 指定成 Any 型別,這個錯誤就會被忽略了......:
https://ithelp.ithome.com.tw/upload/images/20210921/201319896YhGWTad9R.png
紅色毛毛蟲不見惹!所以如果真的有不確定型別的變數的話,請優先考慮使用 Unknown 型別~

今天先暫且介紹到這邊,明天會繼續介紹其他 JavaScript 沒有的型別~


上一篇
Day 4 基本型別 - part 1
下一篇
Day 6 基本型別 - part 3
系列文
TypeScript 三十天學習日記24
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言