如何从 TypeScript 中的类扩展接口？

在 TypeScript 中，类可以通过实现和继承接口来扩展其功能。这使得我们能够更好地遵循开放-关闭原则（Open/Closed Principle），即对修改封闭而对扩展开放。

实现接口

实现一个接口，是指让一个类来实现接口中定义的属性和方法。以下是一个简单的例子：

interface Shape {
  readonly area: number;
  color: string;
  getArea(): number;
}

class Circle implements Shape {
  readonly radius: number;
  color: string;

  constructor(radius: number, color: string) {
    this.radius = radius;
    this.color = color;
  }

  getArea(): number {
    return Math.PI * (this.radius ** 2);
  }

  get area(): number {
    return this.getArea();
  }
}

const circle = new Circle(5, 'red');
console.log(circle.area); // output: 78.53981633974483

在这个例子中，我们创建了一个 Shape 接口，其中包含了一个只读的 area 属性和一个 getArea 方法。然后我们创建了一个 Circle 类，并让它实现了 Shape 接口。通过在 Circle 类中实现 getArea 方法和 area 属性的 getter，我们可以计算出圆的面积，并将其暴露为 area 属性。

继承接口

继承一个接口，是指让一个接口继承另一个接口的属性和方法。以下是一个简单的例子：

interface Auto {
  start(): void;
  stop(): void;
}

interface Car extends Auto {
  drive(): void;
  brake(): void;
}

class SportsCar implements Car {
  start(): void {
    console.log('The sports car is starting...');
  }

  stop(): void {
    console.log('The sports car is stopping...');
  }

  drive(): void {
    console.log('The sports car is driving...');
  }

  brake(): void {
    console.log('The sports car is braking...');
  }
}

const sportsCar = new SportsCar();
sportsCar.start(); // output: The sports car is starting...
sportsCar.drive(); // output: The sports car is driving...
sportsCar.brake(); // output: The sports car is braking...
sportsCar.stop(); // output: The sports car is stopping...

在这个例子中，我们创建了一个 Auto 接口，其中包含了 start 和 stop 方法。然后我们创建了一个 Car 接口，并让它继承了 Auto 接口，并添加了 drive 和 brake 方法。最后我们创建了一个 SportsCar 类，并让它实现了 Car 接口。通过实现 start、stop、drive 和 brake 方法，我们可以让这个类能够启动、停车、行驶和刹车。

总结

通过使用接口来扩展类的功能，我们可以更好地遵循开放-关闭原则，让代码更加灵活和易于维护。在 TypeScript 中，我们可以通过实现和继承接口来实现这一点。