面向对象编程：TypeScript 中的 implements 和 extends 的妙用

2023-10-18 08:57:19

在 TypeScript 的浩瀚宇宙中，面向对象编程 (OOP) 闪耀着璀璨夺目的光芒，而 implements 和 extends 则是这片星空中两颗璀璨的明珠。借助这两颗指路明灯，我们可以构建出复杂且灵活的应用程序。

首先，让我们从类继承类的奥秘开始探索。类继承类，犹如子承父业，后代继承先辈的智慧与能力。TypeScript 允许子类继承父类的属性和方法，并可以扩展或修改这些属性和方法，从而实现代码的复用和扩展。

紧随其后，我们揭开接口继承接口/类的面纱。接口继承接口，犹如学生学习多门学科，每门学科都有其独特的知识体系和技能要求。接口继承类，犹如演员扮演不同的角色，每个角色都有其独特的性格和行为方式。TypeScript 允许接口继承其他接口或类，从而实现代码的模块化和复用。

最后，我们进入类实现接口/类的殿堂。类实现接口，犹如学生完成作业，必须满足老师提出的要求。类实现类，犹如工人制造产品，必须满足客户的特定需求。TypeScript 允许类实现接口或其他类，从而实现代码的兼容性和扩展性。

在 TypeScript 的世界中，implements 和 extends 的妙用无穷，它们使我们能够构建出更加灵活、健壮和可扩展的应用程序。让我们携手遨游 TypeScript 的海洋，尽情探索 OOP 的奥秘，谱写出更加辉煌的代码乐章。

现在，让我们具体看看如何在 TypeScript 中使用 implements 和 extends。

类继承类

class Parent {
  name: string;
  constructor(name: string) {
    this.name = name;
  }

  greet() {
    console.log(`Hello, my name is ${this.name}.`);
  }
}

class Child extends Parent {
  age: number;
  constructor(name: string, age: number) {
    super(name);
    this.age = age;
  }

  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

const child = new Child("John", 25);
child.greet(); // Output: Hello, my name is John and I am 25 years old.

在这个例子中，Child 类继承了 Parent 类，并扩展了 Parent 类的方法 greet()。

接口继承接口/类

interface IAnimal {
  name: string;
  eat(): void;
}

interface IDog extends IAnimal {
  bark(): void;
}

class Dog implements IDog {
  name: string;
  constructor(name: string) {
    this.name = name;
  }

  eat() {
    console.log(`${this.name} is eating.`);
  }

  bark() {
    console.log(`${this.name} is barking.`);
  }
}

const dog = new Dog("Spot");
dog.eat(); // Output: Spot is eating.
dog.bark(); // Output: Spot is barking.

在这个例子中，IDog 接口继承了 IAnimal 接口，并添加了一个新的方法 bark()。Dog 类实现了 IDog 接口，并提供了 eat() 和 bark() 方法的具体实现。

类实现接口/类

interface IShape {
  area(): number;
}

class Circle implements IShape {
  radius: number;
  constructor(radius: number) {
    this.radius = radius;
  }

  area() {
    return Math.PI * this.radius ** 2;
  }
}

class Rectangle implements IShape {
  width: number;
  height: number;
  constructor(width: number, height: number) {
    this.width = width;
    this.height = height;
  }

  area() {
    return this.width * this.height;
  }
}

const circle = new Circle(5);
const rectangle = new Rectangle(10, 15);

console.log(`Area of circle: ${circle.area()}`); // Output: Area of circle: 78.53981633974483
console.log(`Area of rectangle: ${rectangle.area()}`); // Output: Area of rectangle: 150