【TS学习】（19）TS中的类

在 TypeScript 中，类（Class） 是面向对象编程的核心结构，用于封装数据和行为。TypeScript 的类继承了 JavaScript 的类特性，并增加了类型系统和高级功能的支持（如访问修饰符、存取器和装饰器）。

---

1. 属性

(1) 定义

• 属性是类中存储数据的变量。
• 可以使用类型注解为属性指定类型。

(2) 示例

class User {name: string;age: number;constructor(name: string, age: number) {this.name = name;this.age = age;}
}const user = new User("Alice", 30);
console.log(user.name); // 输出 "Alice"

在这里：

• name 和 age 是类的属性，分别表示用户的姓名和年龄。

---

2. 构造函数

(1) 定义

• 构造函数是一个特殊的方法，用于初始化类的实例。
• 使用 constructor 关键字定义。

(2) 简化语法

• TypeScript 支持直接在构造函数参数中声明并初始化属性。

示例

class User {constructor(public name: string, public age: number) {}
}const user = new User("Alice", 30);
console.log(user.name, user.age); // 输出 "Alice 30"

在这里：

• public 修饰符自动将构造函数参数声明为类的属性。

---

3. 方法

(1) 定义

• 方法是类中定义的函数，用于实现特定的行为。
• 方法可以通过 this 访问类的属性和其他方法。

示例

class User {name: string;age: number;constructor(name: string, age: number) {this.name = name;this.age = age;}greet(): void {console.log(`Hello, my name is ${this.name}. I am ${this.age} years old.`);}
}const user = new User("Alice", 30);
user.greet(); // 输出 "Hello, my name is Alice. I am 30 years old."

在这里：

• greet 是一个方法，用于打印用户信息。

---

4. 存取器（Accessors）

(1) 定义

• 存取器是一种特殊的属性，允许通过 get 和 set 方法控制对某个属性的访问和修改。
• 存取器提供了封装和验证的能力。

示例

class User {private _age: number;constructor(age: number) {this._age = age;}// Getterget age(): number {return this._age;}// Setterset age(value: number) {if (value < 0) {throw new Error("Age cannot be negative");}this._age = value;}
}const user = new User(30);
console.log(user.age); // 输出 30user.age = 25; // 设置新的值
console.log(user.age); // 输出 25// user.age = -5; // 报错：Age cannot be negative

在这里：

• _age 是私有属性，外部无法直接访问。
• get age() 和 set age(value) 提供了对 _age 的安全访问和修改。

---

5. 访问修饰符

(1) 定义

• 访问修饰符用于控制类成员的可见性。
• TypeScript 提供了三种访问修饰符：public、private 和 protected。

(2) 常见修饰符

• public：默认修饰符，成员可以在任何地方访问。
• private：成员只能在类内部访问。
• protected：成员可以在类内部和子类中访问。

示例

class User {public name: string; // 公有属性private _age: number; // 私有属性protected role: string; // 受保护属性constructor(name: string, age: number, role: string) {this.name = name;this._age = age;this.role = role;}public getAge(): number {return this._age;}protected getRole(): string {return this.role;}
}class Admin extends User {override getRole(): string {return `Admin: ${super.getRole()}`;}
}const admin = new Admin("Alice", 30, "Super Admin");
console.log(admin.name); // 输出 "Alice"
console.log(admin.getAge()); // 输出 30
console.log(admin.getRole()); // 报错：'getRole' 是受保护方法

在这里：

• name 是公有属性，外部可以直接访问。
• _age 是私有属性，外部无法直接访问。
• role 是受保护属性，只有子类可以访问。

---

6. 装饰器（Decorators）

(1) 定义

• 装饰器是一种特殊的功能，用于在类或类成员上添加元数据或修改其行为。
• 装饰器通常用于框架开发（如 Angular）或元编程场景。

(2) 启用装饰器

• 需要在 tsconfig.json 中启用实验性装饰器支持：

  {"compilerOptions": {"experimentalDecorators": true}
  }
  

示例

以下是一个简单的装饰器示例：

示例 1：类装饰器

function logClass(target: Function) {console.log(`Class ${target.name} has been defined.`);
}@logClass
class User {name: string;constructor(name: string) {this.name = name;}
}const user = new User("Alice"); // 输出 "Class User has been defined."

示例 2：方法装饰器

function logMethod(target: any, propertyKey: string, descriptor: PropertyDescriptor) {const originalMethod = descriptor.value;descriptor.value = function (...args: any[]) {console.log(`Calling method '${propertyKey}' with arguments: ${args}`);return originalMethod.apply(this, args);};
}class Calculator {@logMethodadd(a: number, b: number): number {return a + b;}
}const calculator = new Calculator();
console.log(calculator.add(2, 3));
// 输出：
// Calling method 'add' with arguments: 2,3
// 5

在这里：

• @logClass 是一个类装饰器，用于记录类的定义。
• @logMethod 是一个方法装饰器，用于记录方法调用及其参数。

---

7. 总结

特性	描述
属性	用于存储数据，支持类型注解。
构造函数	用于初始化类的实例，支持简化语法。
方法	用于实现行为，可以通过 this 访问类的属性和其他方法。
存取器	提供对属性的安全访问和修改，支持封装和验证逻辑。
访问修饰符	控制类成员的可见性（public、private、protected）。
装饰器	用于在类或类成员上添加元数据或修改行为，常用于框架开发。