Typescript入門 資料型別

2021-10-02 16:42:31 字數 4355 閱讀 8171

ts的基本的資料型別和js基本資料型別差別較小,因為加入了型別檢驗,所以在定義變數的時候要加入體現資料型別的語法。此外,還有一些型別是ts新加的或者寫法上的變化相對於js較大的資料型別。

因為有型別檢驗,所以像下面一樣這種js原來的賦值方法是不被允許的。

var foo =

'i am a string.'

;foo =12;

foo =

true

;

每個變數在定義的時候必須指明型別,而且只能賦值對應型別的值。如下面**所示:

var foo:string =

'i am a string'

;foo =

123;

// error

foo =

'i am other string'

;// success

基礎型別基本上就是變數名 : 型別的宣告方式。

數字(number)

// number

let decliteral: number =20;

let hexliteral: number =

0x14;;

// 十六進製制

let binaryliteral: number =

0b10100

;// 二進位制

let octalliteral: number =

0o24

;// 八進位制

字串(string)
// string

let name1: string =

'lesifh'

;let sentence =

`你好,我的名字是$`

;console.

log(sentence)

;// 你好,我的名字是lesifh

布林值(boolean)
// boolean

var flag:boolean =

true

;

undefined 和 null

undefined和null型別的值,也只能是undefined 和 null

// undefined 

var unknow:undefined = undefined;

// null

var obj:

null

=null

可能你會說,這有什麼用?

但,他們對於變數的宣告還是很有用的。比如:

var foo:undefined | number | string;
這個foo變數如果忘記賦值就可以顯示為undefined,同時我們也能看出來,typescript對於只宣告而不賦值的變數可以通過|指定多種型別

其他型別

陣列(array)

陣列寫法較js有些差別,並有兩種寫法。

// array

// 寫法一

var list_number:number=

[1,2

,3];

var list_string:string=

['l'

,'e'

,'s'

,'i'

,'f'

,'h'];

// 寫法二

var list2_number:array=[

1,2,

3];var list2_string:array=[

'l',

'e',

's',

'i',

'f',

'h']

;

因為是強型別,所以對於陣列的元素做了限制,必須是同一種且是前面定義的陣列型別。如果陣列元素和定義的陣列型別不一樣,就會報錯(不能通過ts的型別檢驗),一般的ide都會直接有提示,想想和以前陣列裡想放什麼就防什麼的陣列對比,真是嚴格了不少。

想要在乙個陣列裡面放不同型別元素不可以嗎,當然可以。要用到元組的概念:

元組(tuple)

我想定義乙個同時可以設定string和number元素的陣列。

var mix:

[string, number, boolean]

;mix =

['lesifh',23

,true];

// success

但是這樣有很多限制,就是

(1) 陣列元素必須按照定義陣列的時候型別的相應位置來賦值

比如

var mix:

[string, number, boolean]

; mix =

[23,'lesifh'

,true];

// error 第乙個應該是字串,第二個才應該是數字

上面**中的mix陣列只能接受形如[string, number, boolean]的值,型別對應非常嚴格

2. 元素個數也會限制

比如:

var mix:

[string, number, boolean]

;mix =

[23,'lesifh'

,true];

// error

mix =

['lesifh',23

,true

,'lesifh'];

//error 定義了三個,賦值賦了四個

那如何回到原來的「美好」呢?需要用到ts的或者any型別。

任意(any)

顧名思義,允許任何型別的值。和js原生變數一樣沒有資料型別限制。

var foo:any ;

any =1;

any =

'i am a string'

;

ts沒有object型別,js中的物件也可以使用any型別來實現。

var obj:any =

不過,ts的最大優點就是型別校驗,使用了any相當於是放棄了型別校驗,any雖然爽,但也不要能隨便用。

js中的陣列也可以用any實現:

var list:any =[1

,'i am a string',]

;

列舉(enum)

列舉型別聽名字挺難理解的,舉個例子。

比如乙個支付操作,會返回狀態碼,1表示支付成功,-1表示支付失敗,0表示取消支付,如果單純用0,-1,1來表示這些狀態並用到**中,可讀性會很差。我對他的理解只在:賦值的時候有更好的閱讀性 比如success = status.success要比success=1好些,而且同時success的值就是1

let success  =1;

let fail =-1

;let quit =0;

if(status_code == success)

else

if(status_code == fail)

else

if(status_code == quit)

數字的可讀性沒有字母強,這時候,列舉型別的好處就展現出來了

列舉的定義方式和使用

enum status 

let pay_success:status = status.success;

console.

log(pay_success)

;// 1

可以對enum型別變數的元素賦值(數字),不賦值預設自動從0開始。

比如,上面**中的

status.success // 0

status.fail // 1

status.quit // 2

賦值也很簡單。

enum status
需要注意的是,在ts中,undefined和null是所有型別的子型別。

never型別

我還不知道有什麼用,很少用到。不過,有興趣的可以看下尤雨溪大佬在知乎的關於typescript中的never型別具體有什麼用?的回答。

TypeScript入門須知

1.強型別語言 不允許改變變數的資料型別,除非進行強制型別轉換 2.弱型別語言 變數可以被賦予不同的資料型別 3.靜態型別語言 在編譯階段確定所有的變數型別 4.動態型別語言 在執行階段確定所有的變數型別 1.初始化 npm init y 2.全域性安裝ts cnpm i typescript g ...

typeScript 入門 資料的變數宣告

typescript學習模板 基本資料型別 數字 let num0 預設any 泛型 let num1 0let num2 number let num3 number 123 字串 let str0 預設any 泛型 let str1 str1 let str2 string let str3 s...

TypeScript 入門(二) 函式

一 函式定義 1 先看一下es5中定義函式 function fn 匿名函式 var fn1 function 2 在ts中定義函式 function fn string 匿名函式 var fn1 function string 二 函式的傳參 1 ts中函式的傳參 function show na...