3.4 接口继承 - 全栈应用开发修炼手册课程

🎯 学习目标

掌握接口继承的基本语法
理解多重继承的使用
学会覆盖继承的属性
了解接口与类的继承差异

📝 单继承

// 基础接口
interface Person {
  name: string;
  age: number;
}

// 继承扩展
interface Employee extends Person {
  employeeId: string;
  department: string;
}

const employee: Employee = {
  name: 'Alice',
  age: 30,
  employeeId: 'E001',
  department: 'Engineering'
};
      

🔀 多重继承

interface Named {
  name: string;
}

interface Aged {
  age: number;
}

interface Identified {
  id: string;
}

// 多重继承
interface Person extends Named, Aged, Identified {
  email: string;
}

const person: Person = {
  id: 'P001',
  name: 'Alice',
  age: 30,
  email: 'alice@example.com'
};
      

💡

多重继承

TypeScript 接口支持多重继承，可以同时继承多个接口，用逗号分隔。

🔄 属性覆盖

interface Base {
  id: number | string;  // 联合类型
  name: string;
}

// 子接口可以覆盖父接口的属性类型
interface Derived extends Base {
  id: number;  // 收窄类型
  name: string;  // 保持一致
  extra: boolean;  // 新增属性
}

const obj: Derived = {
  id: 123,  // 只能是 number
  name: 'Alice',
  extra: true
};
      

⚠️

类型覆盖限制

子接口覆盖的属性类型必须是父类型的子类型，不能扩大类型范围。

📝 本节小结

✅

• 使用 extends 关键字继承接口
• 支持多重继承，用逗号分隔
• 子接口可以覆盖父接口属性
• 覆盖类型必须是父类型的子类型