TypeScript中Class Interface Type的定义和区别

TypeScript中的Class、Interface和Type是用来定义数据类型的工具。它们的使用情境和作用有些不同。

Class（类）

类可以用于创建对象，它可以定义对象的属性和方法。类可以单继承父类(每个类只能继承一个父类)，并且可以通过创建实例来使用类定义的属性和方法。类可以封装和组织数据和逻辑。

下面是一个Class的代码示例：

// 定义类  人
class Person {
  // 定义"人"这个类包含的属性
  name: string;
  age: number;

  // 实例化对象时，需传入的属性值
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  // 实例化对象可调用此方法
  sayHello() {
    console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`);
  }
}

// 实例化一个"人"的对象
const person = new Person("John", 25);
// 调用此类中包含的方法
person.sayHello();

Interface（接口）

接口是用于定义对象的结构和行为的规范。接口定义了对象应具备的属性和方法，但不提供实现。接口可以用来描述类的公共部分，并且类可以实现一个或多个接口。接口可以继承其他接口。

以下是一个Interface的代码示例：

// 定义接口
interface Shape {
  // 定义抽象方法  
  calculateArea(): number;
}

// 通过implements实现以上的接口
class Circle implements Shape {
  radius: number;
  // 构造器
  constructor(radius: number) {
    this.radius = radius;
  }
  // 实现Shape接口方法
  calculateArea() {
    return Math.PI * this.radius ** 2;
  }
}

// 实例化Circle
const circle = new Circle(5);
// 调用计算面积方法
console.log(circle.calculateArea());

Type（类型）

Type是用于定义数据的形状或结构。 Type可以定义基本类型（如number、string、boolean等）或自定义Type（如对象、数组、元组等）。不支持继承其他Type, 但Type可以使用联合类型、交叉类型等进行复杂定义。 Type可以使用泛型来增加通用性和灵活性。

以下是一个Type的代码示例：

// 描述了一个拥有x和y属性的对象
type Point = {
  x: number;
  y: number;
};

// 描述了一个拥有id和name属性的对象
type Student = {
  id: number;
  name: string;
};

// 描述了一个拥有success和data属性的对象，并且data属性可以是string或number类型
type Result = {
  success: boolean;
  data: string | number;
};

// 定义函数别名，可多处复用(T是一个泛型，此type描述了一个接受泛型参数并返回void的函数类型)
type Callback<T> = (result: T) => void;


// KeyValues类型接收了一个类型参数 T，并使用 extends object 来限制 T 必须是一个对象类型
type KeyValues<T extends object> = {
  [K in keyof T]: T[K];
};

const obj: KeyValues<{ name: string, age: number }> = {
  name: "John Doe",
  age: 25
};

总结

Class是用于定义对象的结构和行为，它是数据和行为的封装。 Interface是用于描述对象的结构和行为的规范，它是对类的抽象。 Type是用于定义数据的形状和结构，它是对数据的抽象。

它们之间的区别在于使用方式和目的不同。Class用于创建对象，Interface用于定义规范，而Type用于定义数据类型。在实际应用中，根据具体需求选择合适的工具。

(如有帮助，请记得点赞三连哦~您的点赞是我持续更新的动力~)