点亮TypeScript技能树（二）

2023-11-24 20:02:41

TypeScript技能树：类、继承和多态性

在上一篇博文中，我们探索了TypeScript的基础知识，现在让我们更深入地了解类、继承和多态性，这些概念是面向对象编程 (OOP) 的基石。掌握这些技能将帮助你创建更强大、更灵活的TypeScript应用程序。

类

TypeScript中的类是OOP的基本构建块，它们允许你组织和封装数据（属性）和行为（方法）。你可以使用以下语法创建类：

class MyClass {
  // 属性
  private name: string;
  public age: number;

  // 方法
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  sayHello(): string {
    return `你好，我叫${this.name}，今年${this.age}岁！`;
  }
}

构造器

构造器是一个特殊的函数，会在创建类的新实例时调用。它通常用于初始化类的属性，如上面的例子中，构造器接受两个参数（name和age）并将其分配给类的私有属性。

方法

方法是类可以执行的操作。它们可以访问类的属性并返回或修改它们。上面的例子中，sayHello()方法返回一个包含对象名称和年龄的字符串。

继承

继承是一种创建新类（派生类）的好方法，该类从另一个类（基类）继承属性和方法。这是一种代码重用和减少重复性的强大技术。你可以使用以下语法创建派生类：

class DerivedClass extends BaseClass {
  // 派生类特有的属性和方法
}

多态性

多态性允许对象以不同的方式响应相同的消息。它通常用于创建具有相似行为的不同类型对象的层次结构。

例如，考虑一个形状类的层次结构：

abstract class Shape {
  abstract getArea(): number;
}

class Circle extends Shape {
  constructor(private radius: number) { super(); }
  getArea(): number { return Math.PI * this.radius ** 2; }
}

class Square extends Shape {
  constructor(private sideLength: number) { super(); }
  getArea(): number { return this.sideLength ** 2; }
}

class Triangle extends Shape {
  constructor(private base: number, private height: number) { super(); }
  getArea(): number { return 0.5 * this.base * this.height; }
}

在上面的例子中，Shape类是抽象类，这意味着它不能被直接实例化。它定义了一个getArea()方法，该方法由派生类（Circle、Square和Triangle）实现。当调用getArea()方法时，每个派生类都会根据其自身的特性计算形状的面积。

实例

现在，我们来看一个使用类、继承和多态性的实际实例：

class Animal {
  constructor(private name: string) {}
  getName(): string { return this.name; }
}

class Dog extends Animal {
  constructor(name: string, private breed: string) { super(name); }
  getBreed(): string { return this.breed; }
}

class Cat extends Animal {
  constructor(name: string, private furColor: string) { super(name); }
  getFurColor(): string { return this.furColor; }
}

const dog = new Dog('Spot', 'Bulldog');
const cat = new Cat('Whiskers', 'Siamese');

console.log(dog.getName());  // 输出：Spot
console.log(cat.getName());  // 输出：Whiskers
console.log(dog.getBreed());  // 输出：Bulldog
console.log(cat.getFurColor());  // 输出：Siamese