typescript中的class与interface和type的区别

目录

Interface（接口）

 Class（类）

Type（类型）

区别和用途

declare class和declare namespace的区别

declare class

declare namespace

declare interface

declare 和 export interface

总结

其他资源

---

在TypeScript中，interface和class都是用来定义类型的工具，但它们有不同的用途和功能。

Interface（接口）

接口是用来描述对象的形状（Shape），也就是对象应该具备哪些属性和方法。它是一种纯粹的类型，不包含任何实现。

interface Person {
  name: string;
  age: number;
  greet(): void;
}

接口通常用于声明对象的类型，以便在代码中使用该类型时进行类型检查和推断。在下面的示例中，我们声明了一个接口Person用来参数传递，用于指定一个人的基本信息类型。

function sayHello(person: Person) {
  console.log(`Hello, ${person.name}!`);
}

let myFriend = {
  name: "Alice",
  age: 30,
  greet() {
    console.log("Hi there!");
  }
};

sayHello(myFriend);

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

以下是一个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());

 Class（类）

类是用来创建对象的蓝图，它包含属性和方法的定义，还可以包含构造函数。类实际上是一种值的定义和实现。

class Dog {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  bark() {
    console.log("Woof!");
  }
}

类通常用于创建实例化的对象，具有特定的行为和状态。在下面的示例中，我们定义了一个Dog类，用于创建一个具有name属性和bark方法的狗的实例。

let myDog = new Dog("Buddy");
console.log(myDog.name); // 输出 "Buddy"
myDog.bark(); // 输出 "Woof!"

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 = (result: T) => void;
 
 
// KeyValues类型接收了一个类型参数 T，并使用 extends object 来限制 T 必须是一个对象类型
type KeyValues = {
  [K in keyof T]: T[K];
};
 
const obj: KeyValues<{ name: string, age: number }> = {
  name: "John Doe",
  age: 25
};

区别和用途

接口主要用于描述数据的形状，用于类型检查和约束。它通常用于定义对象的类型，以及函数的参数和返回值的类型。

类主要用于创建对象的实例，具有属性和方法的定义和实现。它通常用于创建具体的对象，进行对象的实例化和操作。

在使用时，通常考虑以下几点：

• 当需要描述对象的形状和类型时，应该使用接口。
• 当需要创建具体的对象实例，定义对象的行为和状态时，应该使用类。
• 在定义函数的参数和返回类型时,可以使用接口便于统一锲约.

总之，接口用于描述类型，而类用于创建对象。

declare class和declare namespace的区别

在 TypeScript 中，创建 .d.ts 源声明文件时，时常看到有时用declare class,有时候用declare namespace,它们之间有什么区别?

在TypeScript中，.d.ts声明文件通常用于描述 JavaScript 库、模块或全局变量的类型信息。在创建声明文件时，可以使用declare关键字来声明类、命名空间和接口的类型信息。

如果你有 C++ 背景，你可以粗略地将 interface 视为 typedef 并将 declare class 视为 extern 在此编译单元中严格缺少定义的构造函数声明。

declare class

declare class用于声明一个类的类型信息，并且在声明文件中不包含实际的类实现。这样做的目的是告诉TypeScript在编译时该类会在其他地方定义，仅仅只是一个类型声明。

// example.d.ts
declare class MyLibrary {
  constructor(name: string);
  sayHello(): void;
}

在这个例子中，我们使用declare class声明了一个MyLibrary类的类型，但是并没有提供实际的类实现。这样在其他文件中就可以使用这个类而不报错。

declare namespace

declare namespace用于声明一个命名空间的类型信息，定义在全局变量、模块或类里的对象。它通常用于描述全局变量或库的模块化结构，可以包含变量、函数、类、嵌套命名空间等。

// example.d.ts
declare namespace MyLibrary {
  interface Configuration {
    apiKey: string;
    endpoint: string;
  }
  function init(config: Configuration): void;
}

在这个例子中，我们使用declare namespace声明了一个MyLibrary命名空间，并在其中描述了配置接口和初始化函数。这样在其他文件中可以引用这个命名空间中的类型信息。

declare interface

declare interface用于声明一个接口的类型信息，该接口可以描述对象的形状和类型。它用于描述对象的类型，并且不包含实际的实现。

// example.d.ts
declare interface Person {
  name: string;
  age: number;
  sayHello(): void;
}

在这个例子中，我们使用declare interface声明了一个Person接口的类型信息，用于描述一个具有name、age和sayHello方法的对象。

declare 和 export interface

declare用于描述在类型声明文件中的类型信息，告诉TypeScript这些类型不是在当前文件中实际实现的，而是在其他地方定义的。

export用于在模块中导出接口或声明，使其可以在其他模块中被引用。

在.d.ts声明文件中通常不需要使用export关键字，因为它主要用于导出模块中的成员。在类型声明文件中，使用declare就足够了。

综上所述，declare class、declare namespace和declare interface都用于声明类型信息，但是用途和语境略有不同。declare和export关键字也有不同的作用，前者用于描述类型信息，后者用于导出模块成员。

总结

在 TypeScript 中，type、interface 和 class 分别具有自己的用途和特点。

type 适用于定义类型别名、联合类型、交叉类型等，并且不需要运行时信息。

interface 主要用于定义对象的类型和形状，支持继承和实现。

class 既包含类型信息，也包含实际的属性和方法实现。在实际开发中，我们应根据需求选择合适的类型声明方式。

虽然 type 和 interface 在很多场景下可以互换使用，但它们在某些特定场景下有着各自的优势

type 更适用于组合不同类型，如联合类型、交叉类型等，而 interface 更适用于定义对象的形状

特别是在面向对象编程中,class 则提供了完整的类型定义和实现，可以在运行时进行实例化和操作。

在实践中，我们应该根据实际需求和场景选择合适的类型声明方式。

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

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

例如，在定义一个复杂的对象类型时可以使用 interface,在接口参数或返回类型时可以使用interface；在组合不同类型时，可以使用 type；在创建具有行为的对象时，可以使用 class。

其他资源

TypeScript 中的class和interface | w3cschool笔记

https://blog.51cto.com/u_16213678/8476484

https://www.cnblogs.com/minigrasshopper/p/7693478.html

TypeScript中Class Interface Type的定义和区别_ts class interface type-CSDN博客

TypeScipt的class、interface、type区别 - 知乎

javascript - TypeScript 中的 "declare class"和 "interface"有什么区别 - IT工具网