返回

TypeScript 基础语法——剖析类的本质与应用

前端

导语:TypeScript 中的类

在 TypeScript 中,类是一种用来表示对象的蓝图,它定义了对象的数据结构和行为。类可以创建对象实例,对象实例拥有类的属性和方法。类的概念与其他面向对象编程语言中的类相似,但 TypeScript 具有更严格的类型检查,可以帮助您编写出更健壮的代码。

类的基本定义

TypeScript 中的类定义使用 class ,后面跟类名,大括号中包含类的成员。成员可以是属性或方法,属性用于存储数据,方法用于定义行为。

class Person {
  name: string;
  age: number;

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

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

成员属性与成员方法

类中的属性和方法是类的成员。属性用于存储数据,方法用于定义行为。属性可以是公共的、私有的或受保护的,方法也可以是公共的、私有的或受保护的。

公共成员可以使用 public 关键字修饰,私有成员可以使用 private 关键字修饰,受保护成员可以使用 protected 关键字修饰。

构造函数参数属性

TypeScript 中的类可以有构造函数,构造函数用于创建对象实例。构造函数中的参数可以是属性,这些属性称为构造函数参数属性。构造函数参数属性可以在构造函数中被直接赋值,也可以在类中定义属性并通过构造函数参数赋值。

class Person {
  constructor(public name: string, public age: number) {}

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

继承

TypeScript 中的类可以继承其他类,子类可以继承父类的属性和方法。子类也可以覆盖父类的方法,以提供不同的实现。

class Employee extends Person {
  salary: number;

  constructor(name: string, age: number, salary: number) {
    super(name, age);
    this.salary = salary;
  }

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

修饰符

TypeScript 中的类和类成员可以使用修饰符来控制它们的访问权限。修饰符有 publicprivateprotectedstatic

  • public 修饰符表示成员是公共的,可以在任何地方访问。
  • private 修饰符表示成员是私有的,只能在类中访问。
  • protected 修饰符表示成员是受保护的,只能在类中和子类中访问。
  • static 修饰符表示成员是静态的,属于类本身而不是类实例。

静态属性

静态属性是属于类本身而不是类实例的属性。静态属性可以使用 static 关键字修饰。

class Person {
  static species = "Homo sapiens";

  constructor(public name: string, public age: number) {}

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

console.log(Person.species); // Homo sapiens

抽象类

抽象类是不能被实例化的类,抽象类中的方法必须被子类实现。抽象类可以使用 abstract 关键字修饰。

abstract class Animal {
  abstract makeSound(): void;
}

class Dog extends Animal {
  makeSound() {
    console.log("Woof!");
  }
}

class Cat extends Animal {
  makeSound() {
    console.log("Meow!");
  }
}

const dog = new Dog();
dog.makeSound(); // Woof!

const cat = new Cat();
cat.makeSound(); // Meow!

类与接口

类和接口是 TypeScript 中用来定义类型的两种机制。类定义了对象的结构和行为,接口定义了对象的公共属性和方法。接口不能被实例化,但类可以实现接口。

interface Animal {
  makeSound(): void;
}

class Dog implements Animal {
  makeSound() {
    console.log("Woof!");
  }
}

class Cat implements Animal {
  makeSound() {
    console.log("Meow!");
  }
}

const dog = new Dog();
dog.makeSound(); // Woof!

const cat = new Cat();
cat.makeSound(); // Meow!

对象类型与类类型

对象类型是 TypeScript 中用来定义对象的类型的机制,类类型是 TypeScript 中用来定义类的类型的机制。对象类型可以使用 {} 括号来定义,类类型可以使用 class 关键字来定义。

type Person = {
  name: string;
  age: number;
};

class Employee implements Person {
  name: string;
  age: number;
  salary: number;

  constructor(name: string, age: number, salary: number) {
    this.name = name;
    this.age = age;
    this.salary = salary;
  }

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

const person: Person = {
  name: "John Doe",
  age: 30
};

const employee: Employee = new Employee("Jane Doe", 35, 100000);

console.log(person.name); // John Doe
console.log(employee.name); // Jane Doe