ts中的接口

文章类型:TypeScript

发布者:hp

发布时间:2023-05-27

一:定义

接口(Interfaces)用于定义对象的结构或类的契约。它们提供了一种方式来描述对象应该具有的属性和方法的类型

二:基础方式

1:定义对象类型接口

interface Person {
  name: string;
  age?: number;//可选属性
}

const person: Person = {
  name: "Alice",
  age: 25,
};

2:函数类型接口

interface AddFunction {
  (x: number, y: number): number;
}

const add: AddFunction = (x, y) => x + y;

3:类实现接口

interface Animal {
  name: string;
  makeSound(): void;
}

class Dog implements Animal {
  name: string;

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

  makeSound() {
    console.log("Woof!");
  }
}

三:进阶方式

1:扩展接口:通过扩展其他接口来继承其属性和方法。可以将多个接口的成员组合到一个接口中

interface Shape {
  color: string;
}

interface Square extends Shape {
  sideLength: number;
}

const square: Square = {
  color: "red",
  sideLength: 5,
};

2:接口继承:在新接口中包含父接口的属性和方法,并可以添加额外的成员

interface Animal {
  name: string;
}

interface Dog extends Animal {
  makeSound(): void;
}

class Labrador implements Dog {
  name: string;

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

  makeSound() {
    console.log("Woof!");
  }
}

3:索引签名:要定义具有动态属性名的接口。使用索引签名,我们可以在接口中定义一个索引类型,允许通过索引访问对象的属性

interface Dictionary {
  [key: string]: number;
}

const dictionary: Dictionary = {
  apple: 5,
  banana: 3,
};

console.log(dictionary.apple); // 输出: 5