三分钟了解interface和type

概述

在 TypeScript 中，type 和 interface 都用于定义自定义数据结构，但它们有不同的用途和语法。

typescript系列教程

typescript 类型及使用
typescript 三种类修饰符
typescript抽象类 abstract
typescript接口 interface
typescript 泛型常见用法
typescript class可以作为类型定义被扩展
三分钟了解interface和type
typescript 模块化，命名空间
typescript 装饰器全集

type

type 关键字用于创建新的数据类型别名（type alias），它允许你为现有的数据类型（原始数据类型、对象、联合类型、交叉类型等）起一个新的名称。使用 type 可以使代码更具可读性，同时还可以将复杂的类型定义封装起来以便重用。

type User = {
  id: number;
  name: string;
};

type Admin = {
  id: number;
  role: string;
};

type UserOrAdmin = User | Admin; // 联合

type Point2D = { x: number; y: number };
type Point3D = { x: number; y: number; z: number };

type Point2DOr3D = Point2D | Point3D; // 交叉

type MathFunction = (x: number, y: number) => number; // 函数

interface

interface 关键字用于定义对象的结构和属性。它主要用于声明对象的形状，可以包含属性、方法、和可选属性，但不能包含联合类型、交叉类型、或原始数据类型。

interface 在声明类的时候经常用于定义类的接口。类实现（implements）接口时必须实现接口中声明的属性和方法

interface Vehicle {
  start(): void;
  stop(): void;
}

class Car implements Vehicle {
  start() {
    console.log("Car is starting.");
  }

  stop() {
    console.log("Car is stopping.");
  }
}

总结 interface和type的主要区别

1 类型别名可以用于其它类型 （联合类型、元组类型、交叉类型），interface不支持这些，interface支持对象类型定义更好。

type PartialPointX = { x: number };
type PartialPointY = { y: number };

// union(联合)
type PartialPoint = PartialPointX | PartialPointY;

// tuple(元祖)
type Data = [PartialPointX, PartialPointY];

//primitive(原始值)
type Name = Number;

// typeof的返回值
let div = document.createElement('div');
type B = typeof div;

2 interface 可以多次定义 并被视为合并所有声明成员 type 不支持

interface Point {
  x: number;
}
interface Point {
  y: number;
}

const point: Point = { x: 1, y: 2 };

3 type 能使用 in 关键字生成映射类型，但 interface 不行。

type Keys = 'firstname' | 'surname';

type DudeType = {
  [key in Keys]: string;
};

const test: DudeType = {
  firstname: 'Pawel',
  surname: 'Grzybek',
};

4 默认导出方式不同

// inerface 支持同时声明，默认导出 而type必须先声明后导出
export default interface Config {
  name: string;
}
// 同一个js模块只能存在一个默认导出哦
 type Config2 = {name: string}
  export default Config2

type或者interface使用指南

在选择使用 type 还是 interface 时，你可以根据具体情况来决定。通常来说，如果你需要定义对象的结构，或者要求类实现某个结构，使用 interface 是一个不错的选择。而如果你需要复杂的联合类型或交叉类型，或者仅仅是为了给某个类型起一个别名以提高可读性，那么使用 type 是更合适的。