第二週第一天:型別別名與字串字面量型別

第二週第一天:型別別名與字串字面量型別

學習資源


型別別名(Type Aliases)

如果我們想要多次使用同一個複雜的型別,就可以透過 type 語法來建立型別別名,給型別一個新的名稱。

function handleResponse(response: { data: any; statusCode: number }) {
    // ...
}

function fetchData(): Promise<{ data: any; statusCode: number }> {
    // ...
    return Promise.resolve({ data: {}, statusCode: 200 });
}

async function processData() {
    const response = await fetchData();
    handleResponse(response);
}

在上面的例子中,我們多次使用了相同的複雜型別 { data: any; statusCode: number }。這樣的程式碼會讓人難以理解和維護。這時候,我們可以使用型別別名來簡化這個複雜型別:

// 定義型別別名
type ApiResponse = { data: any; statusCode: number };

// 使用型別別名
function handleResponse(response: ApiResponse) {
  // ...
}

// 使用型別別名
function fetchData(): Promise<ApiResponse> {
  // ...
  return Promise.resolve({ data: {}, statusCode: 200 });
}

async function processData() {
  const response = await fetchData();
  handleResponse(response);
}

在這個例子中,我們使用了型別別名 ApiResponse 來表示 { data: any; statusCode: number }。這使得程式碼更容易閱讀和維護,因為現在我們只需要關心 ApiResponse 這個單一概念,而不需要每次都理解整個複雜的型別結構。

需要注意的是,型別別名只是給某個類型起了一個新名字,它本身並不會創建一個全新的型別。

字串字面量型別(String Literal Types)

字串字面量型別是 TypeScript 中一種特殊的型別,它允許我們指定一至多個字串作為變數或參數的實際值。

舉個例子,假設我們正在寫一個函式庫,該函式庫允許使用者設定應用程式的主題。我們希望限制主題只能是 lightdark 這兩個值之一。在這種情況下,就可以使用字串字面量型別來確保參數只接受這兩個值:

type Theme = 'light' | 'dark';

function setTheme(theme: Theme) {
  // 設置主題的邏輯
}

// 這會正常工作,因為 'light' 是允許的值之一
setTheme('light');

// 這會導致編譯時錯誤,因為 'blue' 不是允許的值之一
setTheme('blue');

注意:型別別名與字串字面量型別都是用 type 定義。


真希望每天的篇幅都這麼短!😆 今天可以早點睡養精蓄銳,明天繼續加油!👋