TypeScript數據類型及其相關介紹--簡潔快速過

一、數據類型

1、typeScript語法使用 冒號表示類型，例如布爾類型： let isDone: boolean = false;
2、數據類型都是小寫的，一共有11種類型

• 普通的雷同js的3種類型是：boolean、number、string、
• 其他的有：數組、object、元組 Tuple、枚舉、Any、Void、Null 和 Undefined、Never、

基本類型簡介

1. 布爾值類型同js一樣，true/false值

2. 數字類型除了js一樣之外，還可是es6語法的二進制和八進制字面量寫法，編譯成js是十進制

3. 字符串類型，除了js的普通用法，也支持es6的模版字符串的用法，例如let name: string = yan;let sentence: string = `Hello, my name is ${ name }

4. 對象類型object，在 TypeScript 中，我們使用接口（Interfaces）來定義對象的類型

• 簡單接口必須一一對應就像嚴格的數組的解構賦值，不可多不可少
• 接口一般首字母大寫。有的編程語言中會建議接口的名稱加上 I 前綴

interface Person {
readonly id: number;//只讀屬性，除了初始化賦值外，之後都不可賦值
name: string;
age?: number;//可選屬性，初始化可有可無
[propName: string]: any;//任意屬性的賦值，[propName: string]表示鍵名是字符串類型
}
let tom: Person = {
id:1997,//初始化賦值
name: 'Yan',
age:23,
gender: 1212
};

5. 數組類型，有兩種表示方法

• 「類型 + 方括號」表示法:let list: number[] = [1, 2, 3];
• 使用數組泛型，Array<元素類型>:let list: Array = [1, 2, 3];
• 也可用 接口方式表示數組（畢竟數組也是特殊的隊形）

interface NumberArray {
[index: number]: number;
}
let fibonacci: NumberArray = [1, 1, 2, 3, 5];

• 數組定義了類型，那麼數組參數就必須是該類型的否則會報錯，若是一個數組中想要定義多種類型，則可以使用any[]
• 類數組，必須用接口方式定義的，常用的類數組都有自己的接口定義，具體可常看官方文檔

6. 元祖Tuple類型，可以定義不同類型值的數組，但是值的類型和數量必須一一對應否則會報錯，類似嚴格的數組解構賦值例如：

let x: [string, number];
x = ['hello', 10]; // OK；
x = [10, 'hello']; // Error；
x = ['yan', 10,true,0]; // 多值少值都會報錯

7. 枚舉類型：使用枚舉類型可以爲一組數值賦予友好的名字，像是賦予類型一般例如：

enum Color {Red, Green, Blue} 
let c: Color = Color.Green;

• 默認從0開始賦值，可指定賦值例如

enum Color1 {Red = 1, Green, Blue};
let b: Color1 = Color1.Green;//也可全部指定賦值

8. any類型，表示任何類型，可以用於暫且不知道是什麼類型的值，或者動態的值指定類型，因爲any可以是任何類型，而且可以通過編譯，例如：
   let notSure: any = 4; notSure = “maybe a string instead”; notSure = false; // okay, definitely a boolean
   當你只知道一部分數據的類型時，any類型也是有用的，比如有個數組包含了不同數據，let list: any[] = [1, true, “free”]; list[1] = 100;
   變量如果在聲明的時候未指定其類型且未賦值，那麼它會被識別爲任意值類型

9. void類型，表示沒有類型，當函數沒有返回值的時候就可能見到void類型
   -void類型只有兩個值undefined和null，所以申明也只能是這兩個值

10. Null 和 Undefined類型，默認情況下null和undefined是所有類型的子類型。

• 可以把 null和undefined賦值給其他類型的變量例如
  當你指定了–strictNullChecks標記，null和undefined只能賦值給void和它們各自。 這能避免 很多常見的問題。
• 也許在某處你想傳入一個 string或null或undefined，你可以使用聯合類型string | null | undefined

11. Never類型，表示的是永不存在的值的類型
    例如， never類型是那些總是會拋出異常或根本就不會有返回值的函數表達式或箭頭函數表達式的返回值類型；

• 變量也可能是 never類型，當它們被永不爲真的類型保護所約束時。
• never類型是任何類型的子類型，也可以賦值給任何類型；
  然而，沒有類型是never的子類型或可以賦值給never類型（除了never本身之外）。 即使 any也不可以賦值給never
  下面是一些nerver的函數// 返回never的函數必須存在無法達到的終點

function error(message: string): never { 
throw new Error(message);
 } // 推斷的返回值類型爲
 neverfunction fail() { 
 return error("Something failed");
  } // 返回never的函數必須存在無法達到的終點function infiniteLoop(): never { while (true) { 
  } 
} 

二、幾類相關類型內容介紹

• 類型推斷、聯合類型、類型斷言、

1、類型推論：

定義：變量申明沒有指定類型賦值，那麼ts會依照類型推論給變量指定一個類型
例如：let noType = 100;//類型推論則給變量默認爲數值型，若是再次賦值爲string類型則會報錯

2、聯合類型：

定義：表示取值可以爲多種類型中的一種（類似取或值）

• 例如表示變量可取string或者number類型，但是不能取其他值例如布爾值不然會報錯

let myFavoriteNumber: string | number;
myFavoriteNumber = 'seven';
myFavoriteNumber = 7;

• 當 TypeScript 不確定一個聯合類型的變量到底是哪個類型的時候，我們只能訪問此聯合類型的所有類型裏共有的屬性或方法例如

function getString(something: string | number): string {
return something.toString();
}

• 當聯合類型被賦值之後，會根據類型推論的規則判斷出一個類型，這時候操作必須是複合推論類型的操作例如

let myFavoriteNumber: string | number;
myFavoriteNumber = 'seven';
console.log(myFavoriteNumber.length); // 5
myFavoriteNumber = 7;
console.log(myFavoriteNumber.length); // 編譯時報錯

3、類型斷言：

定義：類型斷言（Type Assertion）可以用來手動指定一個值的類型。
簡單來講就是可以通過類型斷言不對某段代碼做編譯，但是無法避免運行時的錯誤反而濫用類型斷言可能會導致運行時錯誤

兩種形式：
1、尖括號法：let someValue: any = “this is a string”; let strLength: number = (someValue).length;
2、as語法：let someValue: any = “this is a string”; let strLength: number = (someValue as string).length;

兩種形式都可以看個人喜好，但是當你在TypeScript裏使用JSX時，只有 as語法斷言是被允許的

類型斷言應用：

• 將一個聯合類型斷言爲其中一個類型

interface Cat {
name: string;
run(): void;
}
interface Fish {
name: string;
swim(): void;
}
function swim(animal: Cat | Fish) {
(animal as Fish).swim();
}
const tom: Cat = {
name: 'Tom',
run() { console.log('run') }
};
swim(tom);
// Uncaught TypeError: animal.swim is not a function`

• 將一個父類斷言爲更加具體的子類（值是具體值的時候可以instanceof，但若只有類型，則無法使用故用斷言是更好的選擇）

class ApiError extends Error {
code: number = 0;//值是具體值
}
class HttpError extends Error {
statusCode: number = 200;
}
function isApiError(error: Error) {
if (typeof (error as ApiError).code === 'number') {
return true;
}
return false;
}

• 將任何一個類型斷言爲 any（不可濫用否則怕會有隱藏問題，）
• 將 any 斷言爲一個具體的類型

類型斷言和類型轉化
類型斷言只會影響編譯，不會影響真正的變量的類型

類型斷言和類型申明
類型申明較爲嚴格
要A斷言爲B，則滿足A兼容B或者B兼容A就可通過斷言去獲取AB的值，
要A賦值給B，則必須滿足A兼容B

類型斷言和範型

總結

typeScript的數據類型較多，真正的吸收還得是項目實戰。