深入理解 TypeScript 介面繼承

一、TS 介面繼承寫法

在 TypeScript 中，介面是一種非常重要的概念，可以用來描述對象的形狀或類的結構。介面繼承是指一個介面可以繼承另一個介面或多個介面的成員。

介面繼承語法如下：

interface ChildInterface extends ParentInterface {
  // 子介面 extends 父介面的成員
  ...
}

舉個例子：

interface Animal {
  age: number;
  eat(): void;
}

interface Person extends Animal {
  name: string;
  sayHi(): void;
}

上述代碼中，Person 介面繼承了 Animal 介面。

二、TS type 繼承

除了介面繼承，TypeScript 中還支持通過 type 關鍵字進行類型的繼承。

type 關鍵字定義的類型別名可以繼承其他類型、聯合類型或交叉類型。

type A = { a: number };
type B = A & { b: number };

上述代碼中，B 類型繼承了 A 類型，是 A 類型與帶有 b 屬性的對象的交叉類型。

三、TS 介面繼承類

在 TypeScript 中，介面還可以繼承類，這個類可以是一個普通類，也可以是一個抽象類。

class Animal {
  age: number;
  eat(): void {}
}

interface Person extends Animal {
  name: string;
  sayHi(): void;
}

上述代碼中，Person 介面繼承了 Animal 類，可以理解為實現了 Animal 類的所有成員。

四、TS 定義介面

在 TypeScript 中，介面的定義可以為對象和函數定義。下面給出對象的定義：

interface Foo {
  propA: number;
  propB: string;
}

上述代碼中，Foo 介面定義了對象的形狀，對象必須包含 propA 屬性和 propB 屬性。

五、TS 介面繼承多個介面

介面之間也可以多重繼承，即一個介面可以同時繼承多個介面，語法如下：

interface ChildInterface extends ParentInterface1, ParentInterface2 {
  // 子介面同時 extends 多個父介面的成員
  ...
}

舉個例子：

interface Person {
  name: string;
  sayHi(): void;
}

interface WorkMan {
  company: string;
  work(): void;
}

interface Employee extends Person, WorkMan {
  dept: string;
  work(): void;
}

上述代碼中，Employee 介面同時繼承了 Person 和 WorkMan 介面，實現了所有繼承介面的成員。

六、TS 類型繼承

TypeScript 還支持類型的繼承，類型繼承可以實現對多個類型的複合。語法如下：

type ChildType = ParentType1 & ParentType2 & ...

舉個例子：

type PersonType = {
  name: string;
  age: number;
}

type InfoType = {
  sex: string;
  address: string;
}

type EmployeeType = PersonType & InfoType;

上述代碼中，EmployeeType 類型繼承了 PersonType 和 InfoType 的成員，是 PersonType 和 InfoType 的交叉類型。

七、介面繼承了 object 類嗎

在 TypeScript 中，如果一個介面不顯式繼承自其它介面，那麼它默認會繼承自 object 類型，object 是 TypeScript 中表示非特定類型的類型，即表示所有對象類型的基礎。

interface Foo {
  propA: number;
  propB: string;
}

const foo: Foo = {}; // TypeScript 報錯：缺少屬性 propA 和 propB。

上述代碼中，Foo 介面沒有繼承其它介面，因此默認繼承自 object 類型。

八、TS 繼承抽象類

除了可以繼承類和介面，TypeScript 還支持繼承抽象類。

抽象類是用來定義標準的類，它不能被實例化，只能用來被子類繼承。抽象類可以包含抽象方法，這些方法只有定義，沒有實現。

abstract class Animal {
  abstract eat(): void;
}

interface Person extends Animal {
  name: string;
}

上述代碼中，Person 介面繼承了 Animal 抽象類，實現了 eat 方法。

九、TS 介面是什麼

TypeScript 中的介面是用來定義對象和函數的規範，介面定義了對象和函數應該擁有的屬性和方法。一個對象或函數如果符合介面的規範，就可以被認為是實現了這個介面。

十、TS 繼承多個介面

在 TypeScript 中，介面允許繼承多個介面，通過這種方式可以實現介面的復用和拓展。當一個介面繼承了多個介面時，它就會包含父介面的所有成員。

舉個例子：

interface Person {
  name: string;
  sayHi(): void;
}

interface WorkMan {
  company: string;
  work(): void;
}

interface Employee extends Person, WorkMan {
  dept: string;
  work(): void;
}

上述代碼中，Employee 介面繼承了 Person 和 WorkMan 介面，實現了所有繼承介面的成員。