Typescript 是一種很不錯的語言。我用了差不多有兩年了，對這門語言還是挺喜歡的。它是 Javascript 的超集，但是遠不止于此。Typescript 在日常開發(fā)中非常好用，也有能幫我避免很多不必要的錯誤。

以下是一些你可能還不知道的 Typescript 功能，這些功能很可能會在你的工作中派上用場。

[[409175]]

@ts-expect-error

假設有下面這段代碼：

const multiply = (a:number,b:number) => a+b; 
multiply('12',13); 

但是 TS 編譯器會提示報錯：Argument of type 'string' is not assignable to parameter of type你不能修改第一個參數(shù)的類型，并且暫時想要忽略 TS 編譯器報出的錯誤，就可以用 @ts-ignore 來抑制錯誤。

const multiply = (a:number,b:number) => a*b; 
// @ts-ignore 
multiply('12',13); 

當你修復了錯誤，并將傳給 multiply 函數(shù)的第一個參數(shù) '12' 改為 12 后：

const multiply = (a:number,b:number) => a+b; 
// @ts-ignore 
multiply(12,13); 

千萬別忘了把我們之前使用的 @ts-ignore 指令刪除，因為它會永遠忽略下一行，除非你把它刪掉，否則將來可能會導致代碼出現(xiàn)錯誤。

如果擔心自己忘記刪除，也可以用 @ts-expect-error 指令，它與 @ts-ignore 指令類似，不同的是一旦錯誤被修復，TS 編譯器就會提示報錯。

const multiply = (a:number,b:number) => a+b; 
// @ts-expect-error 
multiply(12,13); 

Unused '@ts-expect-error' directive.

這樣能夠提醒你在修復錯誤后立即刪除指令。

never 類型

假設有一個接受錯誤狀態(tài)碼并根據(jù)狀態(tài)拋出錯誤的函數(shù)，在這種情況下，當 function 不會正常結束時，never 類型就派上用場了。

never 和 void 之間的區(qū)別是：void 意味著至少要返回一個 undefined 或 null，而 never 意味著不會正常執(zhí)行到函數(shù)的終點。

function throwError(error: string): never {  
        throw new Error(error);  
}  

模板文字類型模板文字類型類似于 javascript 中的字符串類型，但是特定于類型。假設你想實現(xiàn)一個彈出框的庫，并且有一個用于定位彈出框的類型：

type popoverPositions = 'top'|'bottom'|'left'|'right'|'top-left'|'top-right'|'top-center'|'bottom-left'|'bottom-right'|'bottom-center'; 

但是在實際使用中，對這些類型進行排列組合會讓你抓狂。

通過使用模板字面量類型，你可以很方便的進行分解并組合類型，這樣就可以得倒包含所有可能組合出的新類型了：

type positions = 'top'|'bottom'|'center'; 
type directions = 'left'|'right'|'center' 
type popoverPositions = positions | directions | `${positions}-${directions}` 

生成所有類型為：

type popoverPositions = positions | directions | "top-left" | "top-right" | "bottom-left" | "bottom-right" | "center-left" | "center-right" 

空斷言

空斷言用來告訴 TS 編譯器你的值既不是 null 也不是 undefined。假設已經把值初始化為：

let myNumber:null | number = null; 

但是稍后要更新 myNumber 的值：

myNumber = 69; 

假設我們有一個只接受 number 類型的函數(shù)，

const add = (a:number,b:number) => { 
    return a + b; 
} 
add(myNumber,1); 

這時編譯器會報錯：Argument of type 'null' is not assignable to parameter of type 'number'.所以在這里，可以在變量末尾使用帶有 ! 的空斷言，告訴編譯器傳入的值不為空。

const add = (a:number,b:number) => { 
    return a + b; 
} 
add(myNumber!,1); 

上面的代碼能夠編譯成功。

合并接口

Megring Interfaces 是 declaration merging 的類型，當你有兩個同名的interfece 時，它能夠將它們合并為一個單獨的接口

interface Box { 
  height: number; 
  width: number; 
} 
interface Box { 
  scale: number; 
} 
let box: Box = { height: 5, width: 6, scale: 10 }; 

所以在這里，可以創(chuàng)建兩個同名的獨立接口，然后把它們合并為一個接口，并且可以按照上面的例子使用。

總結

TypeScript 是 JavaScript 的一個超集，主要提供了類型系統(tǒng)和對 ES6 的支持，盡管有一些學習成本，但是如果我們能夠善用這種語言的類型系統(tǒng)和保護機制，就能夠避免 JavaScript 的一些坑，并減少對代碼的維護成本，空出跟多的時間來摸魚。