05 · 类与面向对象

NOTE
TS 的 class 是 ES6 class 的超集，额外加了访问控制、抽象类、参数属性等 OOP 利器。本篇讲清类在 TS 里的正确打开方式。

1. 类的基础#

1
class Person {
2
  name: string;
3
  constructor(name: string) {
4
    this.name = name;
5
  }
6
  greet(): string {
7
    return `我是 ${this.name}`;
8
  }
9
}
10
const p = new Person("Tom");

2. 访问修饰符#

修饰符	可见范围
`public`	默认，哪都能访问
`private`	仅类内部（编译期约束，不等于运行时私有）
`protected`	类内部 + 子类
`readonly`	只读，初始化后不可改

1
class Account {
2
  private balance = 0;
3
  readonly id = "A001";
4
  deposit(n: number): void {
5
    this.balance += n; // ✅ 内部可访问
6
  }
7
}
8
const a = new Account();
9
// a.balance; // ❌ private 外部不可访问

注意：TS 的 private 是编译期检查，运行时仍可访问（编译后是普通属性）。需要真运行时私有用 #field（JS 原生私有字段）。

3. 参数属性（简写）#

构造函数里直接加修饰符，会自动声明并赋值成员，少写样板：

1
class User {
2
  constructor(
3
    public id: number,
4
    public name: string,
5
    private token: string,
6
  ) {}
7
}
8
const u = new User(1, "Tom", "x");
9
u.id;    // ✅
10
u.token; // ❌ private

等价于手写 id: number; constructor(id) { this.id = id; }，但更简洁。

4. 继承 extends 与 super#

1
class Animal {
2
  constructor(public name: string) {}
3
  move(): void { console.log(`${this.name} 移动`); }
4
}
5
class Dog extends Animal {
6
  constructor(name: string, public breed: string) {
7
    super(name); // 必须先调 super
8
  }
9
  bark(): void { console.log("汪"); }
10
}

子类构造函数必须先 super() 再访问 this。

5. 抽象类 abstract#

抽象类不能实例化，用于定义骨架：

1
abstract class Shape {
2
  abstract area(): number; // 子类必须实现
3
  describe(): string {
4
    return `面积 ${this.area()}`;
5
  }
6
}
7
class Circle extends Shape {
8
  constructor(public r: number) { super(); }
9
  area(): number { return Math.PI * this.r ** 2; }
10
}
11
// new Shape(); // ❌ 抽象类不能 new

6. implements 实现接口#

类可以”实现”接口，保证具备接口要求的成员：

1
interface Loggable {
2
  log(): void;
3
}
4
class Logger implements Loggable {
5
  log(): void { console.log("log"); }
6
}

implements 只做结构检查，不继承实现——接口里没有方法体。一个类可实现多个接口。

接口 vs 抽象类：接口只约束形状（多实现、无状态）；抽象类可带实现与状态（单继承）。

7. 存取器 getter / setter#

1
class Temperature {
2
  private _c = 0;
3
  get celsius(): number { return this._c; }
4
  set celsius(v: number) {
5
    if (v < -273.15) throw new Error("低于绝对零度");
6
    this._c = v;
7
  }
8
  get fahrenheit(): number { return this._c * 9 / 5 + 32; }
9
}

getter/setter 让”看似属性访问”实则带校验逻辑，且只在 target >= ES5 时可用。

8. 静态成员#

1
class MathUtil {
2
  static PI = 3.14159;
3
  static square(n: number): number { return n * n; }
4
}
5
MathUtil.square(3); // 不需要实例

小结#

修饰符 public/private/protected/readonly 控制可见性与可变性（编译期）。
参数属性 constructor(public x) 一键声明+赋值。
extends 继承，super() 必须先调用；abstract 定义骨架。
implements 让类满足接口（多实现、无继承）；getter/setter 带逻辑的属性访问；static 类级成员。

练习#

写一个 abstract class Vehicle { abstract wheels(): number }，派生 Car 和 Bike 实现。
用参数属性写一个 class Point { constructor(public x, public y) }，加 distance() 方法。
用 implements 让一个 class Cache 满足 interface Storage { get(k): string; set(k, v): void }。
给某属性加 setter 做范围校验（如年龄 0–150），越界抛错。