TypeScript基础知识三：接口（interface）

2023-12-01 05:46:05

接口是对相对复杂情况的约束

本章主要介绍对象和类中应用到的规范基础，包括对象、函数、类型注解和类，提供实例说明，便于理解和掌握TypeScript中的接口概念。

对象、函数

先来看（回忆）一下对象和函数的约束：

// 对象
const person: {
  name: string;
  age: number;
} = {
  name: '张三',
  age: 18,
};

在这个对象中，我们明确地指定了对象的形状，即它包含了两个属性：name和age，它们的类型分别是字符串和数字。

// 函数
const sum = (a: number, b: number): number => {
  return a + b;
};

在这个函数中，我们明确地指定了函数的参数类型和返回值类型，即它接收两个数字参数并返回一个数字。

类型注解

TypeScript还允许我们使用类型注解来指定变量的类型，即使我们没有显式地创建一个对象或函数。例如：

let name: string = '张三';

在这个例子中，我们使用string类型注解来指定变量name的类型。

类

类是TypeScript中用来创建对象的蓝图，它允许我们定义对象的属性和方法。例如：

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.`);
  }
}

在这个例子中，我们定义了一个名为Person的类，它包含了两个属性：name和age，以及一个名为greet()的方法。

接口

接口是TypeScript中用来定义对象的形状的工具，它允许我们指定对象应该包含哪些属性以及它们的类型。例如：

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

这个接口定义了一个名为Person的对象，它包含了两个属性：name和age，它们的类型分别是字符串和数字。

接口可以用于约束对象，例如：

const person: Person = {
  name: '张三',
  age: 18,
};

在这个例子中，我们使用Person接口来约束对象person，确保它包含了正确的属性和类型。

接口还可以用于约束类，例如：

class Person implements 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.`);
  }
}