TypeScript學習筆記—安裝與基礎型別

黃先生發表於2019-02-16
TypeScript筆記型別

angular等大型框架的基礎語言為typescript，學習了一陣angular後，又回來重新學習typescript，有了一些體會，在這裡和大家進行一下分享。

安裝TypeScript和編譯

安裝TypeScript非常簡單，在計算機安裝了node.js的情況下，通過npm就可以安裝：

npm install -g typescript

TypeScript是以ts為副檔名的檔案，不能直接使用，要編譯為javascript檔案，才能使用。例如我們有一個greeter.ts檔案，編譯命令是：

tsc greeter.ts

輸出結果為一個greeter.js檔案。這樣我們就可以使用了。

TypeScript的基礎型別

為了讓程式有價值，我們需要能夠處理最簡單的資料單元：數字，字串，結構體，布林值等。 TypeScript支援與JavaScript幾乎相同的資料型別，此外還提供了實用的列舉型別方便我們使用。這裡通過程式碼列舉一下typescript的基礎型別,注意看在冒號和等號之間的程式碼，它定義了變數的型別，在函式中就代表引數或返回值的型別。
布林值：let isDone: boolean = false;
數字：所有數字型別都是浮點型：let decLiteral: number = 6;
字串：let name: string = "bob";
陣列有兩種定義方法：
let list1: number[] = [1, 2, 3];
let list2: Array<number> = [1, 2, 3];
元祖：這是一個新的概念。
定義元祖：let x: [string, number];
給元祖賦值：x = [`hello`, 10];
如果元祖值越界，會採用聯合型別替代x[3] = `world`;
訪問元祖裡的資料：console.log(x[0] + ` ` + x[1] + ` ` + x[3] + x[5]);
訪問的結果是：hello 10 world undefined
這裡有個有趣的現象，x[5]越界了而且沒有定義，結果為undefined。
列舉：enum型別是對JavaScript標準資料型別的一個補充。使用列舉型別可以為一組數值賦予友好的名字。
定義列舉：enum Color {Red, Green, Blue}
將列舉屬性賦值給變數：
let c: Color = Color.Green;
let colorName: string = Color[2];
c的值變為Green。
預設情況下，從0開始為元素編號。 你也可以手動的指定成員的數值：

enum Color {Red = 1, Green = 2, Blue = 4}
let c: Color = Color.Green;

c的指還是Green
any型別：有時候，我們會想要為那些在程式設計階段還不清楚型別的變數指定一個型別。 這些值可能來自於動態的內容，比如來自使用者輸入或第三方程式碼庫。 這種情況下，我們不希望型別檢查器對這些值進行檢查而是直接讓它們通過編譯階段的檢查。 那麼我們可以使用 any型別來標記這些變數。

let notSure: any = 4;
let list3: any[] = [1, true, "free"];
list[2] = 100;

list的內容變為：[1, true, 100]
any型別和Object型別的區別：Object型別的變數只是允許你給它賦任意值 – 但是卻不能夠在它上面呼叫任意的方法，any型別可以呼叫任意方法。
void：這個型別和其他有void型別的語言含義相同，表示不返回任何值。這個型別主要用在函式的返回值上，宣告一個void型別的變數沒有什麼大用，因為你只能為它賦予undefined和null。
null 和 undefined：這兩個型別用處也不是很大，也許在某處你想傳入一個 string或null或undefined，你可以使用聯合型別string | null | undefined（聯合型別後面再說）。
never：never型別表示的是那些永不存在的值的型別。

// 返回never的函式必須存在無法達到的終點
function error(message: string): never {
    throw new Error(message);
}
// 推斷的返回值型別為never
function fail() {
    return error("Something failed");
}
// 返回never的函式必須存在無法達到的終點
function infiniteLoop(): never {
    while (true) {
    }
}

型別斷言：有時候你會比TypeScript更瞭解某個值的詳細資訊。通過型別斷言這種方式可以告訴編譯器你要宣告的型別。
型別斷言的兩種寫法：

  • 尖括號語法
let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;
  • as語法
let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;

TypeScript的基本型別就是這些了，在這裡給大家羅列出來，作為參考。

相關文章