系統學習 TypeScript（三）——基礎型別

程式設計三昧發表於2022-02-24
TypeScript型別

TypeScript

前言

TypeScript 包含的基礎型別總結起來有：

  • 布林值
  • 數字
  • 字串
  • 陣列
  • 元組
  • 列舉
  • 任意值
  • 空值
  • Null 和 undefined
  • Never
  • Object

今天，我們就來詳細瞭解一下各個型別所代表的含義及表示方法。

布林值 → boolean

它只有兩個值——true 和 false。

let isNew: boolean = true;

數字 → number

TypeScript 中的整形和浮點數型別都是 number，這點和 JavaScript 是一樣的，比如：十進位制、二進位制、八進位制和十六進位制的型別都是 number。

let decAge: number = 22;
let hexAge: number = 0x0016;
let binaryAge: number = 0b10110;
let octalAge: number = 0o026;
// 以上變數使用 (number).toString(10) 轉換為十進位制都為 22
可使用 (number).toString(進位制) 將數字轉換為任意進位制的型別。

字串 → string

和 JavaScript 一樣，字串的值使用單引號或者雙引號包裹：

let myName: string = "程式設計三昧";
let myHomepage: string = `example.com/${myName}`;

陣列

TypeScript 中定義陣列的方式有兩種。

第一種是元素型別後面接上 []，表示由此型別元素組成的一個陣列：

let arr: number[] = [1, 2, 3, 4];
// 如果在陣列中加入其他元素會報錯

第二種是使用陣列泛型定義陣列：

let arr1: any[] = [1, "2", 3, "4"];
// 這個陣列中可以假如任意型別的元素

元組 Tuple

元組型別允許表示一個已知元素數量和型別的陣列，各元素的型別不必相同。

let arr2:[number, string, number] = [1,"2",3];
// 若果寫成 [1,2,3] 會報錯

元素是嚴格規定了陣列的長度和每個位置的元素型別，並且在賦值時需要嚴格對應，否則會報錯。

列舉

enum型別是對JavaScript標準資料型別的一個補充。 像C#等其它語言一樣，使用列舉型別可以為一組數值賦予友好的名字。

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

預設情況下，從0開始為元素編號。 你也可以手動地指定成員的數值。 例如，我們將上面的例子改成從 1開始編號：

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

或者，全部都採用手動賦值：

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

列舉型別提供的一個便利是你可以由列舉的值得到它的名字。 例如，我們知道數值為2，但是不確定它對映到Color裡的哪個名字，我們可以查詢相應的名字：

enum Color {Red = 1, Green, Blue}
let colorName: string = Color[2];

console.log(colorName);  // 顯示'Green'因為上面程式碼裡它的值是2

任意值 any

代表任意型別的值。如果不希望型別檢查器對這些值進行檢查而是直接讓它們通過編譯階段的檢查。，那麼就可以使用 any型別來標記這些變數：

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

空值 void

當一個資料沒有任何型別時，通常用 void 標記，多用於函式返回值。

function sayName(): void {
    console.log(`My name is 程式設計三昧。`);
}
let aNull: void = null;
let aNull1: void = undefined;
void 型別只能被賦值為 null 或者 undefined。

null 和 undefined

TypeScript 中也有 null 和 undefined 兩種型別，它們只能各自對應 null 值和 undefined 值。

let theNull: null = null;
let theUndefined: undefined = undefined;

這兩個型別基本上沒啥大的用處。

null 和 undefined 是否可賦值給 number 型別的變數，取決於編譯配置檔案中的 “--strictNullChecks” 選項是否關閉，一般是建議開啟這個選項的。

Never

never型別表示的是那些永不存在的值的型別。 例如， never型別是那些總是會丟擲異常或根本就不會有返回值的函式表示式或箭頭函式表示式的返回值型別； 變數也可能是 never型別，當它們被永不為真的型別保護所約束時。

never型別是任何型別的子型別，也可以賦值給任何型別；然而，沒有型別是never的子型別或可以賦值給never型別（除了never本身之外）。 即使 any也不可以賦值給never。

下面是一些返回never型別的函式：

// 返回never的函式必須存在無法達到的終點
function error(message: string): never {
    throw new Error(message);
}

// 推斷的返回值型別為never
function fail() {
    return error("Something failed");
}

// 返回never的函式必須存在無法達到的終點
function infiniteLoop(): never {
    while (true) {
    }
}

object

object 型別包含除了幾種基本型別之外的所有型別。

let obj: object = [1,2,3];
let obj1: object = {
    name: "程式設計三昧"
};
let func: object = ()=>{
    console.log("程式設計三昧");
}

擴充套件

1、TypeScript 會根據你給變數的初始值判斷預設型別。

let aNum = 12;
aNum = "number";
// Type 'string' is not assignable to type 'number'.

2、函式方法的引數和返回值都可以使用型別限制，保證傳參和返回值的正確性。

function sum(a: number, b:number): number {
    return a + b;
}
sum(1, "3");
// Argument of type 'string' is not assignable to parameter of type 'number'.

總結

以上就是 TypeScript 中的基礎資料型別介紹，總結起來就是：

  • 在變數（函式的括號）後面新增冒號，後面跟上期望的型別，即可限制型別的前後一致性；
  • 如果沒有顯式的新增型別限制，TypeScript 會根據初始值自動新增型別。

~

~ 本文完，感謝閱讀！

~

學習有趣的知識，結識有趣的朋友，塑造有趣的靈魂！

大家好，我是〖程式設計三昧〗的作者 隱逸王，我的公眾號是『程式設計三昧』，歡迎關注，希望大家多多指教！

相關文章