TypeScript接口用法（基础）

2023-11-14 14:46:26

TypeScript 接口：定义对象的形状和规范代码

TypeScript 是一个强大的 JavaScript 超集，引入了一系列特性来增强代码的可维护性和安全性。接口是 TypeScript 中的一个重要概念，它允许定义对象的形状，指定其属性和方法的类型。本文将深入探讨 TypeScript 接口，包括它们的命名约定、属性检查、函数类型、接口实现、接口继承以及类继承接口。

接口的命名

接口的命名遵循帕斯卡命名法，即首字母大写。这样做是为了与类区分，例如：

interface User {
  // ...
}

属性检查

接口可以定义对象的属性及其类型。这有助于确保对象具有预期的数据结构。例如：

interface Person {
  name: string;
  age: number;
  // ...
}

此接口定义了 Person 类型的对象，该对象具有两个属性：name（类型为 string）和 age（类型为 number）。

函数类型

接口还可以定义函数类型。这允许您指定函数的参数和返回值类型。例如：

interface FunctionInterface {
  (a: number, b: number): number;
}

此接口定义了一个函数类型，该函数接受两个数字参数并返回一个数字。

接口实现

类和对象可以通过实现接口来遵守其合同。这意味着它们必须提供接口中定义的属性和方法。例如：

class Student implements Person {
  name: string;
  age: number;
  // ...
}

const student = new Student();
student.name = "John";
student.age = 21;

类 Student 实现了 Person 接口，因此它必须提供 name 和 age 属性。

接口继承接口

接口可以继承其他接口，从而扩展其功能。例如：

interface AdvancedUser extends User {
  isAdmin: boolean;
  // ...
}

AdvancedUser 接口继承了 User 接口，并添加了一个额外的 isAdmin 属性。

类继承接口

类可以继承接口，就像它们继承其他类一样。例如：

class Admin implements AdvancedUser {
  name: string;
  age: number;
  isAdmin: boolean;
  // ...
}

类 Admin 继承了 AdvancedUser 接口，因此它必须实现其所有属性和方法。

示例：类型检查

接口的一个强大用法是实施类型检查。以下示例展示了如何使用接口来验证创建的用户对象的有效性：

interface User {
  name: string;
  age: number;
}

function createUser(user: User) {
  console.log(`Name: ${user.name}, Age: ${user.age}`);
}

createUser({ name: "John", age: 30 });  // 正确
createUser({ name: "Jane" });  // 错误：缺少age属性