TypeScript中extends与implements的区别

在 TypeScript 中，extends 和 implements 都是用于实现面向对象编程中继承和多态的重要关键字

extends（继承）

extends 用于类之间的继承，一个类可以继承另一个类的属性和方法。

基本用法

class Animal {
  name: string;
  
  constructor(name: string) {
    this.name = name;
  }
  
  move(distance: number = 0) {
    console.log(`${this.name} moved ${distance}m.`);
  }
}

class Dog extends Animal {
  breed: string;
  
  constructor(name: string, breed: string) {
    super(name); // 必须调用父类的构造函数
    this.breed = breed;
  }
  
  bark() {
    console.log("Woof! Woof!");
  }
  
  // 重写父类方法
  move(distance: number = 5) {
    console.log("Running...");
    super.move(distance); // 调用父类方法
  }
}

const dog = new Dog("Buddy", "Golden Retriever");
dog.move(10); // Running... Buddy moved 10m.
dog.bark();   // Woof! Woof!

继承的原理

1. 原型链继承：子类的原型对象指向父类的实例

2. 构造函数调用 ：必须调用 super() 来初始化父类

3. 方法重写 ：子类可以重写父类方法，通过 super 调用父类实现

implements（实现接口）

implements 用于类实现接口，确保类满足接口定义的契约。

基本用法

interface Animal {
  name: string;
  move(distance: number): void;
}

interface Pet {
  owner: string;
  play(): void;
}

class Dog implements Animal, Pet {
  name: string;
  owner: string;
  breed: string;
  
  constructor(name: string, owner: string, breed: string) {
    this.name = name;
    this.owner = owner;
    this.breed = breed;
  }
  
  move(distance: number) {
    console.log(`${this.name} ran ${distance} meters`);
  }
  
  play() {
    console.log(`${this.name} is playing with ${this.owner}`);
  }
  
  bark() {
    console.log("Woof!");
  }
}

实现多个接口

interface Swimmer {
  swim(): void;
}

interface Flyer {
  fly(): void;
}

class Duck implements Swimmer, Flyer {
  swim() {
    console.log("Duck is swimming");
  }
  
  fly() {
    console.log("Duck is flying");
  }
}

主要区别

特性	extends	implements
用途	类继承类	类实现接口
继承实现	继承具体实现	只继承类型约束
多重继承	不支持（单继承）	支持（多接口实现）
构造函数	必须调用 super()	不需要调用 super()
方法实现	自动继承父类实现	必须自己实现所有方法

高级用法

接口继承接口

interface Animal {
  name: string;
}

interface Mammal extends Animal {
  hasFur: boolean;
}

interface Pet extends Mammal {
  owner: string;
}

class Cat implements Pet {
  name: string;
  hasFur: boolean = true;
  owner: string;
  
  constructor(name: string, owner: string) {
    this.name = name;
    this.owner = owner;
  }
}

类实现泛型接口

interface Repository<T> {
  findById(id: number): T | undefined;
  save(entity: T): void;
}

class UserRepository implements Repository<User> {
  private users: User[] = [];
  
  findById(id: number): User | undefined {
    return this.users.find(user => user.id === id);
  }
  
  save(user: User): void {
    this.users.push(user);
  }
}

混合使用 extends 和 implements

class Vehicle {
  start() {
    console.log("Vehicle started");
  }
}

interface Electric {
  batteryLevel: number;
  charge(): void;
}

class ElectricCar extends Vehicle implements Electric {
  batteryLevel: number = 100;
  
  charge() {
    this.batteryLevel = 100;
    console.log("Fully charged");
  }
  
  // 继承自 Vehicle
  // start() 方法已存在
}

实际应用场景

extends 适用场景

• 需要代码复用和继承实现时

• 建立 is-a 关系（Dog is an Animal）

• 需要方法重写和扩展功能时

implements 适用场景

• 需要强制实现特定契约时

• 多态性设计，不同类实现相同接口

• 依赖注入和测试时使用接口抽象

理解 extends 和 implements 的区别和原理，有助于在 TypeScript 中设计出更加清晰、可维护的面向对象代码结构。