TypeScript?Typeof運算符的5個實用技巧詳解
正文
在 JavaScript 中,你可以通過操作符獲取變量的類型typeof,那么你知道typeofTypeScript 中使用的是什么操作符嗎?在本文中,我將介紹 typeof 運算符的 5 個常見應用場景,你可能會在以后的項目中使用它們。
1.獲取對象的類型

對象是一個普通的manJavaScript 對象,在 TypeScript 中你可以使用類型或接口來定義對象的類型。使用這種對象類型,您可以使用 TypeScript 的內(nèi)置實用程序類型,例如 Partial、Required、Pick 或 Readonly,來處理對象類型以滿足不同的需求。
對于簡單的對象,這可能沒什么大不了的。但是對于嵌套層次更深的大型復雜對象,手動定義它們的類型可能會讓人麻木。要解決這個問題,可以使用 typeof 運算符。
type Person = typeof man; type Address = Person["address"];
與之前手動定義類型相比,使用 typeof 運算符變得容易得多。Person["address"]是一種索引訪問類型,用于在另一種類型(Person 類型)上查找特定屬性(地址)。
2.獲取一個將所有枚舉鍵表示為字符串的類型
在 TypeScript 中,枚舉類型是編譯成常規(guī) JavaScript 對象的特殊類型:

因此,您也可以typeof在枚舉類型上使用運算符。但這通常沒有太大的實際用途,在處理枚舉類型時,通常與keyof運算符結(jié)合使用:

3.獲取函數(shù)對象的類型
還有另一種更常見的場景,在您的工作中使用 typeof 運算符。獲取到對應的函數(shù)類型后,可以繼續(xù)使用TypeScript內(nèi)置的ReturnType和Parameters實用類型分別獲取函數(shù)的返回值類型和參數(shù)類型。

4.獲取類對象的類型
既然typeof操作符可以處理函數(shù)對象,那么它可以處理Class對象嗎?答案是肯定的。

在上面的代碼中,createPoint是一個創(chuàng)建 Point 類實例的工廠函數(shù)。通過typeof操作符可以獲取Point類對應的構(gòu)造簽名,從而實現(xiàn)對應的類型校驗。在定義Constructor的參數(shù)類型時,如果沒有使用typeof操作符,會出現(xiàn)如下錯誤信息:

5. 獲得更精確的類型
在使用typeof操作符的時候,如果你想得到更精確的類型,那么你可以將它與TypeScript 3.4 版本中引入的const 斷言結(jié)合起來。 這以以下方式使用。

從上圖可以看出,在使用了const assertion之后,再使用 typeof 操作符,我們可以得到更精確的類型。
以上就是TypeScript Typeof運算符的5個實用技巧詳解的詳細內(nèi)容,更多關于TypeScript Typeof運算符的資料請關注腳本之家其它相關文章!
相關文章
JS中字符問題(二進制/十進制/十六進制及ASCII碼之間的轉(zhuǎn)換)
對于js的進制轉(zhuǎn)換的一些方法分析2008-11-11
在 JavaScript 中保留小數(shù)點后兩位的方法
在 JavaScript 中,有多種方法可以保留小數(shù)點后兩位,本文給大家分享比較常用的方法,文末給大家介紹了實現(xiàn)數(shù)據(jù)格式化保留兩位小數(shù)的多種方法,感興趣的朋友一起看看吧2023-10-10
JS控制div跳轉(zhuǎn)到指定的位置的幾種解決方案總結(jié)
這篇文章主要介紹了JS控制div跳轉(zhuǎn)到指定的位置的幾種解決方案總結(jié),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。2016-11-11
Ajax實現(xiàn)省市區(qū)三級聯(lián)動實例代碼
這篇文章介紹了Ajax實現(xiàn)省市區(qū)三級聯(lián)動的方法,文中通過示例代碼介紹的非常詳細。對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-04-04

