1，型別總覽

型別	例子	描述
number	1、2、3	任意數字
string	'xxx'	任意字串
boolean	true / false	布林值
undefined	const n: undefined = undefined	一個沒有被賦值的變數
null	const n: null = null	尚未建立的物件
object	{ name: '' }	任意物件
array	[1, 2, 3]	任意陣列
Symbol	let n: symbol = Symbol('k')	表示獨一無二的值
BigInt	let n: bigint = BigInt(9007199254740991)	內建物件表示大於`253 - 1`的整數
字面量	let a:'hello' = 'hello'	其本身
any	任意值	任意型別的值
unknown	任意值	安全型別的any
void	let a: void = undefined	沒有值或者undefined
never	(): never => {}	永不存在的值
tuple	[1, 2, 3]	元組固定值和長度的陣列
enum	enum Color {Red, Green}	列舉用於取值被限定在一定範圍內的場景

2，基本型別

2.1，布林

let isDone: boolean = false

2.2，數字

let isNum: number = 6

2.3，字串

let name: string = 'bob'
name = 'smith'
let name2: string = `Genez${name}`

2.4，Null

let n: null = null

2.5，undefined

const n: undefined = undefined

2.6，symbol

let n: symbol = Symbol('k')

2.7，bigint

let n: bigint = BigInt(9007199254740991)

3，引用型別

3.1，陣列 Array

宣告方式一

let list: number[] = [1, 2, 3]

宣告方式二

let list: Array<number> = [1, 2, 3]

多型別陣列

const arr1: (number | string)[] = [1, 'string', 2]
const arr2: Array<any> = [1, 'string', null]

使用type約束的陣列

type T = number | string
const arr: Array<T> = [1, '張三']

使用interface約束的物件陣列

interface Item {
  id: number
  name: string
  isDad: boolean
}
const objectArr: Array<Item> = [{ id: 1, name: 'demo', isGod: true }]

3.2，物件 Object

普通物件

const n: object = {
  value: '',
  size: 20
}

interface定義

interface Hero {
  name: string
  age: number
  skill: string
  skinNum?: number
  say(): string // say函式返回值為 string
  [keyName: string]: any // 當前Hero可定義任意字串型別的key
}

const t:Hero = {
    name: '999',
    age: 20,
    skill: '',
    say() {
        return ''
    },
    kkk: ''
}

type定義

type Hero = {
  name: string
  age: number
  skill: string
  skinNum?: number
}

任意型別

interface AnyObject {
  [key: string]: any
}

const t:AnyObject = {
    name: '999',
    age: 20,
    skill: '',
    kkk: null,
    aaa: undefined
}

3.3，函式 Function

普通定義函式

function fn(name: string, size: number, state?: number, text: string = '', ...param: number[]):object {
  return {
    name,
    size
  }
}

箭頭函式

const fn2: (a: number, b: string) => string = function (a:number, b:string): string {
  return ''
}

無返回值

const fn2: (a: number, b: string) => void = function (a:number, b:string): void {
  console.log(a, b)
}

使用interface定義函式

interface SearchFn{
  (param1: string, param2: string): boolean
}

const fn3:SearchFn = function(param1, param2) {
  return param1 === param2
}

不確定引數個數

function pu(array: any[], ...items: any[]) {
    items.forEach(function(item) {
        array.push(item);
    });
}
let a = [];
pu(a, 1, 2, 3);

4，TypeScript新增型別

4.1，元祖 Tuple

元組型別允許表示一個已知元素數量和型別的陣列，各元素的型別不必相同，賦值的型別、位置、個數需要和定義（生明）的型別、位置、個數一致。

元組最重要的特性是可以限制陣列元素的個數和型別，它特別適合用來實現多值返回，用於儲存定長定資料型別的資料。

例子

let uple: [string, string, number] = ["zed", "darts", 25]

可選元素

let uple: [string, string, number?] = ["zed", "darts"]

不定個數

type RestTupleType = [number, ...string[]]
let restTuple: RestTupleType = [666, "Semlinker", "Kakuqo", "Lolo"]

只讀

const point: readonly [number, number] = [10, 20]

4.2，列舉 enum

使用列舉我們可以定義一些帶名字的常量。使用列舉可以清晰地表達意圖或建立一組有區別的用例。

例子

enum Enum {
     A,
     B,
     C
}
console.log(Enum.A) // 列印出 0
console.log(Enum.B) // 列印出 0

設定初始值

enum Enum {
     A = 8,
     B,
     C
}
console.log(Enum.A) // 列印出 8
console.log(Enum.B) // 列印出 9

字串列舉，每個都需要宣告

enum Enum {
     A = "8號",
     B = "9號",
     C = "10號"
}
console.log(Enum.A) // 列印出 8號

4.3，Any

在程式設計階段還不清楚型別的變數指定一個型別，可以使用 any型別來標記這些變數

例子

let notSure: any = 4
notSure = false
notSure = ''

let list: any[] = [1, true, "free"]
list[1] = 100

4.4，Void

void型別像是與any型別相反，它表示沒有任何型別。當一個函式沒有返回值時，你通常會見到其返回值型別是void

例子

function warnUser(): void {
    console.log("xxxxxxxxx");
}

// 只能為它賦予undefined和null
let unusable: void = undefined

4.5，Never

never型別表示的是那些永不存在的值的型別，丟擲異常或者是死迴圈

例子

// 異常
function err(msg: string): never { // OK
  throw new Error(msg); 
}

// 死迴圈
function loopForever(): never { // OK
  while (true) {};
}

4.6，Unknown

unknown與any一樣，所有型別都可以分配給unknown。與any的最大區別是：任何型別的值可以賦值給any，同時any型別的值也可以賦值給任何型別。unknown 任何型別的值都可以賦值給它，但它只能賦值給unknown和any。

例子

let notSure: unknown = 4;
let uncertain: any = notSure; // OK

let notSure: any = 4;
let uncertain: unknown = notSure; // OK

let notSure: unknown = 4;
let uncertain: number = notSure; // Error

4.7，字面量

使用一個字串字面量型別作為變數的型別

例子

let hello: 'hello' = 'hello';
hello = 'hi'; // 報錯

如果看了覺得有幫助的，我是@鵬多多，歡迎點贊關注評論；END

PS：在本頁按F12，在console中輸入document.querySelectorAll('.diggit')[0].click()，有驚喜哦

公眾號

往期文章

個人主頁

TypeScript學習第二天：認識ts的資料型別