TypeScript重学之旅：从实战角度深入理解实例和静态属性

2023-11-17 15:20:04

实例属性与静态属性

在TypeScript中，实例属性是指属于类的实例的属性，而静态属性是指属于类的本身的属性。实例属性只能通过类的实例来访问，而静态属性可以通过类的本身或类的实例来访问。

举个例子，如果我们定义了一个Person类，那么我们可以定义一个实例属性name来存储每个人的姓名，以及一个静态属性numberOfPeople来存储所有人的总数。

class Person {
  name: string; // 实例属性

  static numberOfPeople = 0; // 静态属性

  constructor(name: string) {
    this.name = name;
    Person.numberOfPeople++;
  }
}

我们可以通过以下方式来访问实例属性和静态属性：

const person1 = new Person('John');
console.log(person1.name); // 输出：John

console.log(Person.numberOfPeople); // 输出：1

构造函数

构造函数是在创建类实例时自动调用的一个特殊方法。构造函数用于初始化类的实例属性，并执行其他必要的初始化操作。

在上面的例子中，我们定义了一个构造函数，它接收一个参数name，并将该参数赋值给实例属性name。同时，构造函数还将静态属性numberOfPeople递增1。

使用TypeScript构建一个完整的面向对象程序

现在，让我们使用TypeScript构建一个完整的面向对象程序来演示实例属性、静态属性和构造函数的用法。

class Person {
  name: string; // 实例属性

  static numberOfPeople = 0; // 静态属性

  constructor(name: string) {
    this.name = name;
    Person.numberOfPeople++;
  }

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

  static getTotalNumberOfPeople() {
    return Person.numberOfPeople;
  }
}

// 创建Person类的实例
const person1 = new Person('John');
const person2 = new Person('Mary');

// 调用实例方法
person1.greet(); // 输出：Hello, my name is John.
person2.greet(); // 输出：Hello, my name is Mary.

// 调用静态方法
console.log(Person.getTotalNumberOfPeople()); // 输出：2