為什么要使用TypeScript?
某乎已經解釋的很清楚了傳送門
我目前親身的感受,TpeScript帶來的好處
- 類型系統可以避免很多js的靈活性帶來的隱藏bug,譬如在js里變量是可以到處定義,到處賦值,這就會導致中途你都不知道改成什么類型了,會不會有bug
- 團隊協作代碼風格更加嚴格,這一般是強類型編程語言所帶來的特性之一,譬如很典型的Java,C#等
TpeScript香是香,只是使用中會帶來以下問題。
- 入手門檻高,招人的門檻也高了不少
- 不習慣這么嚴格的語法,導致最后寫成AnyScript,四不像
TypeScript的高級用法
支持”函數定義“
type Foo<T> = T
let nums: Foo<number> = 1
上面可以理解為
function Foo (T: any) {
return T
}
如果我們對T的類型做限制
type foo<T extends string> = T;
則可以理解為
function Foo (T: string) {
return T
}
當然了,我們也可以給T一個默認值
type Foo<T extends string = 'Hello World'> = T;
可以理解為:
function Foo (T: string = 'Hello World') {
return T
}
支持條件判斷
T extends Z ? X : Y
e.g.
type IsNumber<T> = T extends number ? 'this is a number' : 'this is not a number';
動態推導出聯合類型
interface Student {
name: string;
age: number;
}
type studentKey = keyof Student; // "name" | "age"
遍歷聯合類型
通過 in
關鍵字
type key = 'vue' | 'react';
type MappedType = { [k in key]: string } // { vue: string; react: string; }
通過 索引
type frameworks = ['vue', 'react', 'angular'];
type f0 = frameworks[0]
type f1 = frameworks[1]
type f2 = frameworks[2]
type fa = frameworks[any]
支持 "作用域"
全局作用域
declare module '*.png';
declare module '*.svg';
declare module '*.jpg';
模塊作用域
就像 nodejs
中的模塊一樣,每個文件都是一個模塊,每個模塊都是獨立的模塊作用域。這里模塊作用域觸發的條件之一就是使用 export
關鍵字導出內容。
每一個模塊中定義的內容是無法直接在其他模塊中直接獲取到的,如果有需要的話,可以使用 import
關鍵字按需導入。
參考: