「譯」TypeScript終極指南三:語法糖

原文來自 The Definitive TypeScript Guide -(https://www.sitepen.com/blog/2018/10/29/update-the-definitive-typescript-guide/

語法糖

在深入研究TypeScript的靜態類型功能之前,必須先知曉一下TypeScript中對函數所做的一些改善,其中一些改變使類型系統的特性更易於理解。

TypeScript包括對函數的四個主要改進:可選參數,默認參數,剩餘參數和箭頭函數。

現在可以通過使用問號作為後綴來定義可選參數:

「譯」TypeScript終極指南三:語法糖

在這裡,exclusive是一個可選參數。 在JavaScript中這並沒有意義,因為所有參數都是可選的,但在TypeScript中,編譯器禁止漏掉參數,除非它們被指定為可選參數或具有默認值。

可選參數基本上只是隱性地將undefined指定為默認值的參數。 使用不同的值作為可選參數賦予默認值就像使用問號指定某個參數為可選參數一樣簡單:

「譯」TypeScript終極指南三:語法糖

在這種情況下,min是可選的,默認值為0,exclusive是可選的,默認值為false。

TypeScript還提供了對可變參數的支持,該參數將傳遞給函數的任何額外參數收集到一個命名數組中:

「譯」TypeScript終極指南三:語法糖

在此例中,調用publish('/ foo','a','b','c')將使得topic為字符串'/ foo',args為數組['a','b', 'C' ]。 請注意,使用此功能會為你的函數添加一個額外的循環,該循環在每次調用函數時運行用來將參數收集到rest參數中,因此注重性能的代碼應直接針對arguments對象來進行操作。

TypeScript還支持ES2015的箭頭函數。 這個新的函數方式提供了一種新的簡寫語法,並且還改變了this關鍵字的指向,因此它的值來自最近的詞法作用域範圍,而不是像常規JavaScript函數那樣的指向調用者的上下文:

「譯」TypeScript終極指南三:語法糖

TypeScript還支持對象簡寫,可減少對對象進行一些常規操作的代碼量:

「譯」TypeScript終極指南三:語法糖

解構

可以直接從數組中賦值多個變量:

「譯」TypeScript終極指南三:語法糖

能這樣子簡寫:

「譯」TypeScript終極指南三:語法糖

解構也同樣適用於對象:

「譯」TypeScript終極指南三:語法糖

關於解構可以參考

TypeScript還包括很多當前或未來ECMAScript規範的功能,詳情請參考 What's-new-in-TypeScript(https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript)

類型

在不添加任何類型提示的情況下,TypeScript中的變量屬於any類型,這意味著它們可以容納任何類型的數據,就像在JavaScript中一樣。 在TypeScript中向代碼添加類型約束的基本語法如下所示:

「譯」TypeScript終極指南三:語法糖

在上述代碼中,toNumber函數接受一個必須是字符串的參數,並返回一個數字。變量num被顯式地約束為數字類型(儘管TypeScript足夠聰明,知道標準的parseFloat函數返回一個數字,因此可以推斷該num是一個數字類型)。 TypeScript提供的基本類型與JavaScript的基本一致:any、number、string、boolean、void(即null或undefined)、never以及TypeScript 3.0中的unknown。在大多數情況下,never在代碼流分析檢測到無法訪問的代碼的函數中被推斷出來,作為開發者不必擔心它。例如,如果一個函數只拋出,它將獲得一個never類型(原文:if a function only throws, it will get a nevertype)。 unknown是any類型的安全副本,但在使用該值之前某些位置會執行一些類型的類型檢查。

在編寫表達式(函數調用,算術運算等)時,你還可以顯性地斷言表達式的結果的類型,比如你調用了一個TypeScript無法自動推斷出返回類型的函數,就很有必要了。例如:

「譯」TypeScript終極指南三:語法糖

在此例中,numberStringSwap的返回值是不明確的(any類型),因為該函數可能返回多種類型。為了消除歧義,通過在調用時添加<number>前綴來顯性地斷言賦給num的值的類型。這在任何地方都能做,只要被斷言的類型與返回值的類型兼容即可。換句話說,如果TypeScript知道numberStringSwap(‘1234’)會返回一個數字,則嘗試斷言<string>將導致編譯器錯誤(“無法將數字轉換為字符串”),因為已知這兩種類型不兼容。還有一個替代的語法是使用as關鍵字,如上面對str的賦值所示。使用as與使用<>相同效果相同,但是,<>語法在.tsx文件中不可用,因為它在TSX中存在歧義。因此,as是類型聲明的默認和首選語法。/<string>/<number>

在使用TypeScript編寫代碼時,最好將類型顯性地添加到那些編譯器無法推斷出類型的變量和函數上。如果未對變量進行類型約束且編譯器無法推斷出類型,則會為其隱性地指定為any類型。在編譯時,在tsconfig.json的compileOptions部分中設置“noImplicitAny”:true 將防止任何意外的隱性any類型藏在你的代碼中(即編譯器不夠聰明能推斷出正確類型的區域)。

TypeScript還支持字符串字面量類型。當你知道參數的值可以與字符串列表中的某一個匹配時,這將非常有用,例如:let easing: "ease-in" | "ease-out" | "ease-in-out";

局部類、接口、枚舉和類型別名聲明也能出現在函數聲明中。局部類型的作用域範圍被阻斷,類似於使用let和const聲明的變量。

未完待續,敬請期待下一篇


分享到:


相關文章: