[譯] TypeScript:擁有超能力的 JavaScript(下)

jonjia發表於2018-03-22

TypeScript:擁有超能力的 JavaScript(下)

[譯] TypeScript:擁有超能力的 JavaScript(下)

歡迎回來,繼前文 [譯] TypeScript:擁有超能力的 JavaScript (上) 之後,本週帶來下篇。

[譯] TypeScript:擁有超能力的 JavaScript(下)

使用列舉(enum)可以更清晰地組合一組資料。

下面我們來看看如何構造一個列舉型別:

[譯] TypeScript:擁有超能力的 JavaScript(下)

你可以通過下面的方法從列舉中取值:

[譯] TypeScript:擁有超能力的 JavaScript(下)

但這樣返回的是這個值的整數索引,和陣列一樣,列舉型別的索引也是從 0 開始的。

那我們怎麼獲取到 "Indrek" 呢?

[譯] TypeScript:擁有超能力的 JavaScript(下)

注意看我們怎麼獲取到字串的值。

[譯] TypeScript:擁有超能力的 JavaScript(下)

還有一個很好的例子是使用列舉儲存應用的狀態。

[譯] TypeScript:擁有超能力的 JavaScript(下)

如果你想了解更多關於列舉(enum)的知識,stackoverflow 上的這個回答 探討了更多關於列舉的細節。


[譯] TypeScript:擁有超能力的 JavaScript(下)

假設我們請求某個 API,獲取了一些資料。我們總是期望成功獲取資料 — 但如果我們無法獲取到資料會怎樣呢?

是時候返回 never 型別了,比如下面這種特殊使用場景:

[譯] TypeScript:擁有超能力的 JavaScript(下)

注意我們傳遞的 message 引數

我們可以在另外的方法中呼叫 error 方法(回撥)

[譯] TypeScript:擁有超能力的 JavaScript(下)

因為我們推斷返回值的型別是 never,所以我們宣告返回值的型別為 never,而不是 void


[譯] TypeScript:擁有超能力的 JavaScript(下)

  • null — 沒有任何值。
  • undefined — 變數被宣告瞭,但沒有賦值。

它們本身的型別用處不是很大。

[譯] TypeScript:擁有超能力的 JavaScript(下)

預設情況下 nullundefined 是所有型別的子型別。就是說你可以把 nullundefined 賦值給 number 型別的變數。

[譯] TypeScript:擁有超能力的 JavaScript(下)

圖片來自 stackoverflow

關於 nullundefined,Axel Rauschmayer 博士寫過 一篇非常棒的文章


[譯] TypeScript:擁有超能力的 JavaScript(下)

型別斷言通常會發生在你清楚地知道一個實體具有比它現有型別更確切的型別。

它在執行時沒有影響,只會在編譯階段起作用。TypeScript 會假設你 — 程式設計師,已經進行了必要的檢查。

下面是一個簡單示例:

[譯] TypeScript:擁有超能力的 JavaScript(下)

尖括號 <> 語法與 JSX 用法衝突,所以我們只能使用 as 語法進行斷言。

[譯] TypeScript:擁有超能力的 JavaScript(下)

關於型別斷言的更多內容

一些更酷的東西

現在 — 用 TypeScript 來構造些有趣的東西吧!?

感謝閱讀,希望你有所收穫!

你可以關注我的 Twitter


掘金翻譯計劃 是一個翻譯優質網際網路技術文章的社群,文章來源為 掘金 上的英文分享文章。內容覆蓋 AndroidiOS前端後端區塊鏈產品設計人工智慧等領域,想要檢視更多優質譯文請持續關注 掘金翻譯計劃官方微博知乎專欄

相關文章