Typescript是基於Javascript所延伸出來的一種超集,讓js能夠像Java、C#一樣有強型別的概念,同時,還提供了對ES5、ES6的支援。
優點
缺點
npm install typescript --save-dev
tsc 檔案名稱 => 將ts檔編譯為js檔
let myString: string = "hello"; // 字串 let myNumber: number = 10 // 數值 let myBool: boolean = true; // 布林值
可以兼容多種型態
let myUnionVar: string | number = "hello"; myUnionVar = 10;
有兩種表示方式
let myStrArray1: string[] = ["a", "b", "c"]; let myStrArray1: Array<string> = ["a", "b", "c"];
如果使用此型態,基本上就像是在寫js,沒有利用到ts帶給我們的好處,不得已時才使用
let a: any = 10; a.split(","); // runtime時才會報錯
function parseStringToInt(str: string): number { // 括號外的是function的回傳型別 return parseInt(str, 10); }
必須放在必要參數之後
function parseStringToInt(str: string, base?: number): number { if(base == null) return parseInt(str, 10); else return parseInt(str, base); }
function parseStringToInt(str: string, base: number = 10): number { return parseInt(str, base); }
enum Gender { Male, Female, Transgender } let gender: Gender = Gender.Male;
type Person = { name: string; country: string; age: number } function greeting(person: Person) { console.log(`Hello, my name is ${person.name}, I\'m ${person.age} years old. I\'m from ${person.country}.`); }
interface Person { name: string; country: string; age: number } function greeting(person: Person) { console.log(`Hello, my name is ${person.name}, I\'m ${person.age} years old. I\'m from ${person.country}.`); }
Type Alias和Interface,它們的功能非常相似,而且時常可以混用。針對這個部分,Typescript的官方文件推薦,除非遇到無法使用Interface的情況,否則我們應該盡可能的使用Interface。
這次的Typescript介紹先到這邊,主要是介紹一些常用且基礎的語法。至於會不會有後續介紹,這個要再看看,畢竟我也才剛接觸Typescript,進階的語法可能需些時間消化並整理,謝謝大家。
參考連結
https://www.typescriptlang.org/docs/handbook/intro.html
https://willh.gitbook.io/typescript-tutorial/