如何在TypeScript中使用extends关键字扩展接口？

首先得修正你代码里的语法问题——UserExtraDetail接口最后缺了个闭合的}，先补全才能正常使用：

interface UserExtraDetail {
  age: number;
  mobileNumber: number;
}

接下来用extends实现需求有两种常用方式：

方式一：直接让原UserInstance继承UserExtraDetail #

如果允许修改原UserInstance接口，直接在定义时加上extends UserExtraDetail即可，这样UserInstance会自动包含UserExtraDetail的所有属性：

interface UserInstance extends UserExtraDetail {
  id: number;
  firstName: string;
  lastName: string;
  getFullName(): string;
}

现在UserInstance的实例就同时拥有id、firstName、lastName、getFullName()方法，以及age、mobileNumber属性。

方式二：创建新接口同时继承两个原有接口 #

如果不想改动原有的UserInstance和UserExtraDetail接口，可以新建一个接口，通过extends同时继承两者：

interface UserInstance {
  id: number;
  firstName: string;
  lastName: string;
  getFullName(): string;
}

interface UserExtraDetail {
  age: number;
  mobileNumber: number;
}

// 新接口同时拥有两个父接口的所有成员
interface UserWithExtraDetail extends UserInstance, UserExtraDetail {}

TypeScript里接口支持多继承，多个父接口用逗号分隔就行。

内容的提问来源于stack exchange，提问作者Bennison J