Typescript基礎(1)——數據類型


前言

這是開始學習Typescript的一些筆記,涉及的都是很基礎的知識點。大神們請繞路或者歡迎指點。今天開始第一部分數據類型的學習。

數據類型

Typescript中為了使代碼編寫更加規范,更加易於維護。增加了類型校驗
所謂類型校驗:就是定義的變量始終只能是定義時指定的數據類型。也就是說定義變量的時候必須指定類型。當然typescript也支持原生js的寫法。
比如:我們將a定義成number類型,如果我們在后面使用a時,將其修改成了string類型。那么會出現報錯。

let a:number = 12;
a = 'hello'  // 報錯 Type '"hello"' is not assignable to type 'number'

Typescript中常見的數據類型如下:

布爾類型(boolean)

let flag:boolean = false;
console.log(flag)
flag = true;

flag = false;


在typescript中boolean類型的值只有兩個true和false。不同於js中,非0的數值,非空的字符串等都可以表示true。在typscript中將boolean類型的值賦值成1,0等會報錯。

let flag:boolean = true;
flag = 1;  // 報錯:在js中1能夠代表true。但是在ts中1表示number類型。因此會出現錯誤。

數字類型(number)

let num:number = 12;
num = 12.4444;
console.log(num)

字符串類型(string)

let str:string = 'helloworld';
console.log(str)

數組類型(Array)

typescript中定義數組有兩種方式:
第一種定義數組的方式:在元素類型后面接上[],表示由此類型元素組成的一個數組

let arr1:number[] = [1,2,3];
console.log(arr1)
let arr2:string[] = ['hello','world'];
console.log(arr2)

第二種定義數組的方式:使用數組泛型,Array<元素類型>:

let arr3:Array<number> = [11,22,33];

元組類型(tuple)

元組類型是數組類型的一種特例。數組類型只允許元素是一種數據類型。而元組類型允許元素是多種數據類型。比如,你可以定義一對值分別為 string和number類型的元組。

let tuple1:[string,number] = ['hello',12]
console.log(tuple1[0])

但是,元組類型和元素必須一一對應。

let tuple2:[string,number] = [20,'world']  // 沒有一一對應

枚舉類型(enum)

在計算機科學中,我們經常使用數值來表示一種狀態。但是對於較多的狀態使用數值來表示可能導致易讀性差。比如十二生肖如果我們用0,1,2,3,4...11來表示,那么可能根本不知道究竟每一個代表什么。但是如果我們用有含義的單詞來表示,那么程序就比較容易理解與閱讀。比如看到豬我就知道這個生肖是豬。枚舉就是考慮到所有的可能出現的值,然后用具有函數的單詞來表示它。

枚舉又可以成為一一列舉,在計算機計算中,將一個有窮序列集所有可能的值列舉出來就稱為枚舉。比如:星期可以使用Sunday、Monday、Tuesday、Wednesday、Thursday、Friday、Saturday來進行枚舉。生肖可以使用龍、蛇、狗等十二種來進行枚舉。

enum 枚舉名{
  標識符=[整型常數],
  標識符=[整型常數],
  標識符=[整型常數],
}

枚舉類型的使用:枚舉類型如果沒有指定值,那么默認是從0開始。

enum data {
  success,
  error
}
console.log(data.success)  // 0
console.log(data.error)    // 1

如果指定了值,那么從指定的值往下遞增。

enum data {
  pedding,
  success = 100,
  error
}
console.log(data.pedding)  // 0
console.log(data.success)  // 100
console.log(data.error)    //101

任意類型(any)

在typescript中定義變量時通常需要指定類型,但是有時候我們可能不知道這個變量會是什么類型(比如這個變量是用來接收后段發送過來的數據,這個數據類型可能不太確定。)。這時候我們就可以指定any類型。表示可以是任意類型。

let anyVar:any;
anyVar = 123;
console.log(anyVar)
anyVar = [1,2,3];
console.log(anyVar)

另外,當我們只知道一部分數據的類型時,any類型也是有用的。 比如,你有一個數組,它包含了不同的類型的數據:我們可以指定數組中元素類型為any。這樣的話我們就可以隨意地修改數組中的元素了。

let list:any[] = [1,'hello',false];
list[1] = true;  // 將數組第二個元素從string類型修改為boolean
console.log(list[1])

Null 和 Undefined

null和undefined是其他數據類型的子類型。
我們知道在js中定義了變量但是賦值,那么得到的就是undefined。比如:

let u ;
console.log(u)  // undefined

但是在ts中,如果我們定義了一個變量,沒有進行賦值。如果我們使用它會出現報錯。比如:

let u:number;
console.log(u) // Variable 'u' is used before being assigned

但是很多情況下,我們定義了一個變量沒有進行賦值,在后續我們需要根據這個變量是否有值來進行判斷。但是這種情況下就會報錯。因此:我們希望能夠
在沒有獲取值的情況下不會報錯,這時候就可以使用undefined了。

let u2:number|undefined;
console.log(u2)
u2 = 123;
console.log(u2)

同理Null類型也是為了處理值為null時的情況。

void類型

void類型表示沒有任何類型,一般用於定義方法的時候,方法沒有返回值。

function warnUser(): void {
    console.log("This is my warning message");
}

never類型

never類型是那些總是會拋出異常或根本就不會有返回值的函數表達式或箭頭函數表達式的返回值類型。

let a:never;
a = (() => {throw new Error('拋出異常')})()

如果變量有確定的類型,那么使用never類型就會報錯。比如:
定義變量n為never類型。但是將n賦值為number類型了,那么就會報錯。

let n1:never;
n1 = 123;

Object類型

object類型表示非原始類型,也就是除number,string,boolean,symbol,null或undefined之外的類型。

declare function create(o: object | null): void;

object類型的值與js中相同。數組,函數,null等都可以是Object類型。

create({ prop: 0 }); // OK
create(null); // OK
create([1,2,3]); // OK
create(function(){})  // OK
create(42); // 報錯
create("string"); // 報錯
create(false); // 報錯

說明

以前學習一些新的知識的時候,學過了如果沒有頻繁地使用,過一段時間就很容易忘記。因此希望使用博客園和github記錄學習過程中的一些筆記,這樣的話,下次再撿起來就比較快了。而且每一次地記錄其實都是對知識點的一次總結,這樣可以加深對知識點的理解和記憶,當然學習過程中,尤其是初學者肯定存在不正確的地方,歡迎大家指正。github中保存了學習過程中的代碼,歡迎star和issue。
github


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM