TypeScript 學習系列 | 什麼是 TypeScript？ 類型有哪些？

為什麼要使用 TypeScript 呢？好處在於掌握輸入和輸出的數值以及類型，編寫的時候即時顯示提供錯誤，輸入的參數也可以先定義好，避免踩到不清楚資料型別時的坑，比如資料等於 0 是數字還是布林值這種。

¶程式語言類型有以下兩種：

動態類型語言：執行期間才會檢查數據，初始化時不用給定型態或變量，ex: JavaScript, Ruby, Python
靜態類型語言：編譯階段即執行形態檢查，須在執行前聲明變量或是數據類型， TypeScript 即屬於這類型。

---

安裝方法，打開終端機輸入

npm install -g typescript 

檢查安裝版本

tsc -v

執行 ts 檔案自動生成 js 檔 （要先移動到該目錄）

tsc hello.ts

第一個 TypeScript 檔案就從 Hello World 開始吧！
建立檔案的時候，不要忘記檔名是 .ts 結尾。

使用方法不難，在變數後方指定傳入的類型，如果傳入的是數字或是非字串等類型，編輯器就會報錯

const hello = (name: string) => {
	return `hello ${name}`
}

hello('emma')

¶TypeScript 類型

¶基礎類型

要進入 TypeScript 類型之前，複習一下 JavaScript 中七個原始類型(Primitive type):

• Boolean
• Null
• Undefined
• Number
• Biglnt (ES6)
• String
• Symbol (ES6)

為什麼叫做原始值呢？本身的值無法被改變，例如操作字串一定會返回一個新的字串，原始字串並沒有被改變。

TypeScript 定義類型的方法很簡單，如前面提到在變數後面加上冒號和型別類型即可。以下是範例

let isDone: boolean = false
let age: number = 20
let binaryNumebr: number = 0b1111

//  ES6中："0b"開頭表示將二進位轉成十進位
//  其他進位表示：
//  八進位: 010(ES5.1); 0o10(ES6)
//  十六進位: 0x10(ES5.1)
//  二進位: 0b10(ES6)

let firstName: string = 'emma'
let message: string = `Hello, ${firstName}, age is ${age}`

// 以下兩個為所有類型的子類型，意思為可以被賦值給其他類型
let u: undefined = undefined
let n: null = null

let num: number = undefined
// undefined 的變量可以賦值給 number

---

¶any類型和聯合類型

¶any: 允許賦值為任意類型

應用狀況：不曉得原本的資料類型，例如接API傳回來的資料。應該盡量避免使用，變數的型別可以輕易被改變，另外記得返回類型一定會是any。

let notSure: any = 4
notSure = 'maybe it is a string'
notSure = true

// 屬型和方法也可以被調用
notSure.myName
notSure.getName()

¶聯合類型

應用狀況：只能使用特定允許的類型

let numberOrString: number | string = 234
numberOrString = 'abc'