TypeScript型別系統和基礎型別
型別系統
相對於與ES6來說,TypeScript中最大的改善就是增加了型別系統,這極大的簡化了我們的開發工作。型別系統會對資料進行型別檢查,以避免不必要的錯誤。
型別檢查的好處有:
- 有助於程式碼的編寫,因為它可以在編譯期預防bug
- 有助於程式碼的閱讀,因為它可以清晰地表達我們的意圖
使用的方法
1. 在宣告變數時,可以規定變數所需要的變數型別
語法規則:
變數宣告 變數名:型別;
e.g.
var name:string;
let age:number;
const male:boolean;
當然你也可以賦值:
var name:string='張三';
let age:number=18;
const male:boolean=true;
如果你輸入了錯誤的期望值,那麼會報錯:
var job:string=true;
//Type 'true' is not assignable to type 'string'.
陣列指定變數型別的方式有點兒不一樣,本文下面會有詳細介紹。
2.在宣告函式時,可以為函式引數和返回值指定型別:
語法規則:
function 函式名(變數名:形參型別):返回值型別{}
e.g.
function greet(name:string):string{
return "hello"+name;
}
如果你輸入了錯誤的引數,那麼會報錯:
greet(18);
//Argument of type '18' is not assignable to parameter of type 'string'.
基礎型別
TS的基礎型別有除了有我們所熟悉的Boolean、Number、String、Array、null 和 undefined,還有新增了enum、any、void、never。
Boolean 布林型別
布林型別只有true(真)和false(假)兩個值。
var male:boolean=true;
Number數字型別
TS所有的數字都是由浮點數表示的,這些數字的型別就是number。
var age:number=18;
String 字串型別
string表示文字資料型別。 和JavaScript一樣,可以使用雙引號( “)或單引號(’)表示字串。
var name:string = "張三";
你還可以使用模板字串 它可以定義多行文字和內嵌表示式。 這種字串是被反引號包圍( `),並且以${ expr}這種形式嵌入表示式
模板字串 讓我們不必在字串換行時加上愚蠢的”+”號了,這增加了程式碼的可讀性。
let person:string=`張三今年18;
性別:男;
工作是web前端。`
console.log(person);
//張三今年18;
//性別:男;
//工作是web前端。
嵌入表示式 則提高了我們程式碼編寫的速率,讓程式碼結構更加清晰。
let name:string="張三";
let greet:string=`你好呀~${name}`
console.log(greet);//你好呀~張三
Array 陣列型別
如果陣列是一組相同資料型別的集合,那麼這個陣列有兩種方式來指定資料型別。
語法規則:
- 陣列-型別方式(又名陣列泛型):Array
- 型別-陣列方式:type[]
//陣列-型別方式:
var skills:Array<string>=['ES5','ES6','Angular','Node.js'];
//型別-陣列方式:
var hobbies:string[]=['前端','輕音樂','電競','游泳'];
//使用ES6的箭頭函式,遍歷輸出skills的所有值。
skills.forEach(x=>console.log(x))
//ES5
//ES6
//Angular
//Node.js
hobbies.forEach(x=>console.log(x))
//前端
//輕音樂
//電競
//游泳
箭頭函式是一種快速書寫函式的簡潔語法,本系列其他文章我們會詳細講解。
如果陣列中的元素資料型別不相同,我們可以稱之為元組(Tuple)。
語法規則:
[type1, type2…typeX]
let x:[string,number,boolean];
x=["hello",1,true];
console.log(x[0])//hello
x=[1,1,1];//報錯
//Type '[number, number, 1]' is not assignable to type '[string, number, boolean]'.
//Type 'number' is not assignable to type 'string'.
列舉型別
列舉型別是一組可以命名數值的集合。使用列舉型別可以為一組數值賦予友好的名字。
預設情況下,從0開始為元素編號:
enum color {red,green,blue};
let c:color=color.green;
console.log(c)//1
當然我們也可以從1(或者其他數)開始編號:
enum color {red=1,green,blue};
let c:color=color.green;
console.log(c)//2
再或者全部手動賦值:
enum color {red=1,green=3,blue=5};
let c:color=color.green;
console.log(c)//3
元素編號是遞增的,指定元素編號的下一個元素總是比指定元素編號要大1。(如果下個元素沒指定編號的話)
enum color {red=1,green=3,blue};
let c:color=color.blue;
console.log(c)//4
同樣,我們可以通過元素編號來獲取元素
enum color {red,green,blue};
let c=color[2];
console.log(c)//blue
Any型別
如果我們沒有為變數指定型別的話,那麼它的預設型別就是any。在TS中,any表示可以接受任何型別的資料:
var something;
//這樣的宣告等同於
var something:any;
Void型別
void型別(又稱為“無”型別)表示我們不期望有型別。一般用於函式的返回值,表示沒有任何返回值。
function shopping(name:string):void{
//some codes
}
null和Undefined型別
在TS中,undefined和null兩者各自有自己的型別分別叫做undefined和null。
let u: undefined = undefined;
let n: null = null;
預設情況下null和undefined是所有型別的子型別。 就是說你可以把 null和undefined賦值給number型別的變數。
Never型別
never型別表示的是那麼些永遠不存在的值的型別。更加通俗的講,就是那些總是會丟擲異常或者根本就不會有返回值的函式。
變數也可能是 never型別,當它們被永不為真的型別保護所約束時。
never的特性:
- never 是任何型別的子型別, 並且可以賦值給任何型別.
- 沒有型別是 never 的子型別或者可以複製給 never (除了 never 本身).
- 在一個沒有返回值標註的函式表示式或箭頭函式中, 如果函式沒有 return 語句, 或者僅有表示式型別為 never 的 return
語句, 並且函式的終止點無法被執行到 (按照控制流分析), 則推匯出的函式返回值型別是 never. - 在一個明確指定了 never 返回值型別的函式中, 所有 return 語句 (如果有) 表示式的值必須為 never 型別,且函式不應能執行到終止點.
// 返回never的函式必須存在無法達到的終點(丟擲異常,程式提前終止)
function error(message:string): never {
throw new Error(message);
}
// 推斷的返回值型別為never(永遠不可能執行到最後)
function fail(direction:boolean) {
if(direction){
return 1;
}else{
return -1;
}
return error("永遠不應該到這裡");
}
// 返回never的函式必須存在無法達到的終點(死迴圈,程式不會終止)
function infiniteLoop(): never {
while (true) {
}
}
never型別是任何型別的子型別,也可以賦值給任何型別;然而,沒有型別是never的子型別或可以賦值給never型別(除了never本身之外)。
即使 any也不可以賦值給never。
參考資料:
TS官網
TypeScript 2.0 新特性一覽
《Angular權威教程》
相關文章
- 系統學習 TypeScript(三)——基礎型別TypeScript型別
- typeScript 基礎型別 (三)TypeScript型別
- TypeScript(3)基礎型別TypeScript型別
- TypeScript 型別系統TypeScript型別
- 為vue3學點typescript, 基礎型別和入門高階型別VueTypeScript型別
- TypeScript 中的非基礎型別宣告TypeScript型別
- Java基礎-基本型別和包裝型別Java型別
- typeScript 型別斷言、聯合型別和交叉型別(七)TypeScript型別
- TypeScript型別系統基本規則TypeScript型別
- TypeScript 泛型型別TypeScript泛型型別
- TypeScript this型別TypeScript型別
- C#.Net築基-型別系統①基礎C#型別
- TypeScript Null和Undefined 型別TypeScriptNullUndefined型別
- TypeScript 基本型別和泛型的使用TypeScript型別泛型
- 基礎篇:深入解析JAVA泛型和Type型別體系Java泛型型別
- 系統學習 TypeScript(五)——聯合型別TypeScript型別
- C#.Net築基-型別系統②常見型別C#型別
- Kotlin基礎篇——從型別系統開始Kotlin型別
- TypeScript type 型別別名TypeScript型別
- Typescript:基本型別TypeScript型別
- TypeScript Widened型別TypeScriptIDE型別
- TypeScript Never型別TypeScript型別
- TypeScript Any型別TypeScript型別
- TypeScript 索引型別TypeScript索引型別
- TypeScript 型別相容TypeScript型別
- TypeScript 交叉型別TypeScript型別
- TypeScript void 型別TypeScript型別
- TypeScript 字串型別TypeScript字串型別
- TypeScript 型別安全TypeScript型別
- typescript 介面和物件型別(四)TypeScript物件型別
- TypeScript學習筆記—安裝與基礎型別TypeScript筆記型別
- go語言資料型別-基礎型別Go資料型別
- 基礎篇:JAVA引用型別和ThreadLocalJava型別thread
- TypeScript 聯合型別TypeScript型別
- TypeScript 數值型別TypeScript型別
- TypeScript 布林型別TypeScript型別
- Typescript高階型別TypeScript型別
- TypeScript 對映型別TypeScript型別