成人免费xxxxx在线视频软件_久久精品久久久_亚洲国产精品久久久_天天色天天色_亚洲人成一区_欧美一级欧美三级在线观看

TypeScript 中的類型與接口

開發 前端
TypeScript 中類型表達式的豐富性使得在保持類型安全的同時,更容易與函數式概念如組合和不變性一起工作。

在 TypeScript 中,定義類型有兩種方式:“類型”和“接口”。

人們經常想知道該使用哪一種,答案并非適用于所有情況。有時一種更好,但在許多情況下,兩者可以互換使用。

我們來詳細了解一下類型和接口的不同點和相似點。

類型和類型別名

在 TypeScript 中,我們有一種叫做“類型”的東西,它幫助我們描述我們正在處理的數據類型。這就像為我們的信息提供一個藍圖。

基本類型包括字符串、布爾值、數字、數組、元組和枚舉。

但是,還有更多!我們還有“類型別名”。可以把它們想象成類型的昵稱。我們不是在創建新類型;我們只是給它們起了更友好的名稱。這使我們的代碼更容易閱讀和理解。

例如,我們可以為數字創建一個叫做“我的數字”的類型別名,所以我們可以不用寫“數字”,只需要說“我的數字”。

我們還可以為用戶數據創建一個類型別名,描述一個用戶的數據應該是什么樣子。

當人們討論“類型與接口”時,他們實際上是在討論“類型別名與接口”。這就像給同一組事物起了不同的名稱。

TypeScript 中的接口

在 TypeScript 中,可以將接口視為一個對象必須遵循的規則或要求集合。這就像一份合約,說:“嘿,如果你想成為‘客戶’,你必須有‘名稱’和‘地址’。”

現在,還有另一種表達這些規則的方法。你可以使用所謂的“類型注解”。這有點像說,“這里是‘客戶’應該長什么樣子”,然后列出‘名稱’和‘地址’屬性及其類型,就像你在接口中所做的那樣。

所以,無論你使用接口還是類型注解,你本質上都在定義同樣的期望集合,對于‘客戶’應該是什么樣子。這就像給同一組指令起了兩個不同的名字。

類型和接口的區別

類型和接口用于定義自定義數據結構和形狀,但它們在行為和使用上有一些差異。

原始類型

使用類型:

type MyNumber = number;

在這種情況下,我們創建了一個類型別名 MyNumber,它是 number 原始類型的別名。

使用接口:

你不能使用接口直接定義像 number 這樣的原始類型。它們在 TypeScript 中是預定義的。

聯合類型

使用類型:

type MyUnionType = number | string;

在這里,我們定義了一個類型 MyUnionType,它可以包含 number 或 string 的值。

使用接口:

接口通常不用于直接表示聯合類型。你應該使用類型別名來表示這種用途。

函數類型

使用類型:

type MyFunctionType = (arg1: number, arg2: string) => boolean;

這定義了一個類型 MyFunctionType,用于一個函數,該函數接受兩個參數,一個數字和一個字符串,并返回一個布爾值。

使用接口:

interface MyFunctionInterface {
  (arg1: number, arg2: string): boolean;
}

這個接口 MyFunctionInterface 表示相同的函數類型。

聲明合并

使用接口:

interface Person {
  name: string;
}

interface Person {
  age: number;
}

TypeScript 將自動將這兩個 Person 接口合并為一個,包含 name 和 age 的屬性。

使用類型:

類型別名不支持聲明合并。如果你多次定義相同的類型別名,將導致錯誤。

擴展 vs. 交叉

使用擴展:

interface A { propA: number; }
interface B extends A { propB: string; }

接口 B 擴展了接口 A,繼承了 propA 屬性并添加了新的屬性 propB。

使用交叉:

type AB = A & { propB: string; }

在這里,我們使用交叉來組合 A 的屬性和新屬性 propB,以創建類型 AB。

擴展時處理沖突

TypeScript 要求擴展時具有相同名稱的屬性的類型匹配:

interface A { commonProp: number; }
interface B { commonProp: string; }
interface AB extends A, B { }
// 錯誤: A 和 B 中的 'commonProp' 屬性必須具有相同的類型

typescript要解決沖突,你需要確保類型匹配或使用函數的方法重載。

處理元組類型

使用類型:

type MyTupleType = [number, string];
const tuple: MyTupleType = [42, "hello"];

在這里,我們使用 type 定義了一個元組類型,然后我們可以創建該元組類型的變量。

使用接口:

interface MyTupleInterface {
  0: number;
  1: string;
}
const tuple: MyTupleInterface = [42, "hello"];

你也可以使用接口定義元組類型,使用方式保持不變。

何時使用類型 vs. 接口

當你需要組合或修改現有結構時,使用接口。如果你在處理庫或創建新的庫,接口是你的首選。

它們允許你合并或擴展聲明,使得與現有代碼一起工作更加容易。當你以面向對象編程的方式思考時,接口也更易讀。

當你需要更強大的功能時,選擇類型。TypeScript 的類型系統提供了諸如條件類型、泛型、類型保護等高級工具。

這些功能為你提供了更多控制你的類型的方式,幫助你創建健壯、強類型的應用程序。接口無法提供這些能力。

你通常可以根據個人喜好使用類型或接口。然而,在以下情況下使用類型別名:

  • ? 當你想為基本數據類型(如‘字符串’或‘數字’)創建一個新名稱時。
  • ? 當定義更復雜的類型如聯合、元組或函數時。
  • ? 當重載函數時。
  • ? 當使用高級功能如映射類型、條件類型或類型保護時。

類型通常更靈活和表達性強。它們提供了一系列接口無法匹敵的高級功能,而 TypeScript 持續擴展其能力。

我們使用類型別名自動生成一個對象類型的 getter 方法,這是你無法通過接口做到的:

type Client = {
    name: string;
    address: string;
}
type Getters<T> = {
    [K in keyof T as `get${Capitalize<string & K>}`]: () => T[K];
};
type clientType = Getters<Client>;
// 結果是: 
// {
//     getName: () => string;
//     getAddress: () => string;
// }

通過使用映射類型、模板文字和‘keyof’操作符,我們創建了一個類型,它可以為任何對象類型自動生成 getter 方法。

此外,許多開發者更喜歡使用類型,因為它們與函數式編程范式很契合。

TypeScript 中類型表達式的豐富性使得在保持類型安全的同時,更容易與函數式概念如組合和不變性一起工作。

責任編輯:武曉燕 來源: 技術的游戲
相關推薦

2024-11-11 08:32:00

2024-09-30 08:34:01

TypeScript可讀性安全性

2021-07-27 06:06:34

TypeScript語言運算符

2022-08-08 09:00:42

TypeScript映射類型

2022-04-11 08:42:09

TypeScript子類型定義

2022-04-10 19:26:07

TypeScript類型語法

2020-12-18 11:35:22

TypeScript語言Java

2022-02-25 09:06:02

TypeScripnever工具

2021-10-31 15:46:34

Go語言進程

2011-07-22 13:58:48

java接口

2021-08-18 07:56:05

Typescript類型本質

2024-08-12 08:50:17

2022-09-20 14:43:55

TypeScript類型體操

2025-01-20 00:13:19

TypeScript操作符數據類型

2021-06-09 07:55:19

Typescript類型檢查

2024-01-24 08:31:13

extends?接口規范

2025-03-07 08:44:47

Typescriptiinterfacetype

2011-07-15 15:47:02

JAVA

2022-05-04 09:02:41

TypeScript類型工具

2019-03-21 09:45:11

TypeScript編程語言Javascript
點贊
收藏

51CTO技術棧公眾號

主站蜘蛛池模板: 超碰在线播 | 在线观看免费av网 | 夜夜干夜夜操 | 国产第一页在线播放 | 日日夜夜天天综合 | 国产精品免费观看 | 91精品国产92 | 韩日中文字幕 | 超碰在线亚洲 | 国产美女自拍视频 | 国产精品一区二区在线 | 久久1区| 国产精品久久久久aaaa九色 | 亚洲精品第一 | 婷婷中文字幕 | 久久久一区二区三区 | 精品久久一区 | 日韩中文字幕免费在线观看 | 精品国产一区二区三区成人影院 | www.久久99 | 欧美天堂 | 久久亚洲一区二区三区四区 | yiren22综合网成人 | 91素人 | 国产二区av | 日日夜夜天天 | 色久伊人| 久久这里只有精品首页 | 中文字幕视频在线观看 | 黄色片亚洲 | 欧洲精品一区 | 国产欧美一区二区三区久久 | 成人午夜视频在线观看 | 亚洲一区二区三区免费在线观看 | 久久99久久98精品免观看软件 | 91高清视频在线观看 | 日韩欧美亚洲 | 亚洲一区在线免费观看 | 亚洲女人天堂成人av在线 | 九九九视频精品 | 看一级毛片 |