Разница между интерфейсом и типом в ts

1. Псевдоним типа typeof может использоваться для других типов, таких как тип объединения, тип кортежа , базовый тип, интерфейс может представлять только типы функций, объектов и классов.

// 基本类型

type person = string

// 联合类型

interface Dog {

 name: string;

}

interface Cat {

 age: number;

}

type animal = Dog | Cat

// 元组类型

interface Dog {

name: string;

}

interface Cat {

age: number;

}

type animal = [Dog, Cat]

2. Псевдоним типа не может быть определен несколько раз, и будет сообщено об ошибке, в то время как интерфейс может быть определен несколько раз, и он будет считаться объединенным.

// ok
  interface aaa {
    age: Number;
  }
  interface aaa {
    name: string;
  }

  export const bbb = (params: aaa) => {
    ...
  }

  bbb({name: 'mm', age: 27})  // age和name属性都要有，否则就会报错

// 不ok  
// eslint提示：标识符“aaa”重复。ts(2300)。Use an `interface` instead of a `type`.
  type aaa = string | number;
  type aaa = {x: number, y: number};  

3. Тип может использовать ключевое слово in, а интерфейс — нет.

type Keys = "firstName" | "lastName" ;

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

const test: DudeType = {
    firstName: 'Anna',
    lastName: 'LMY',
}

4. Метод экспорта по умолчанию отличается, интерфейс поддерживает одновременное объявление и экспортируется по умолчанию, а тип должен быть сначала объявлен, а затем экспортирован

// 默认导出 不一致
export default interface{
    name: string;
    age: number;
}

type personInfo = [string, number];
export default personInfo;

// 分别导出 一致
export interface{
    name: string;
    age: number;
}

export type sizeType = 'small' | 'middle' | 'large' | undefined;

5. Методы расширения разные, интерфейс расширяется с помощью extends, а тип расширяется с помощью оператора &

// interface extends interface
interface Person {
  name: string
}
interface User extends Person {
  age: number
}

// interface extends type
type Person = {
  name: string
}
interface User extends Person {
  age: number
}

// type & type
type Person = {
   name: string
}
type User = Person & { age: number }

// type & interface
interface Person {
  name: string
}
type User = {age: number} & Person

6. type может использовать typeof для получения типа экземпляра

let div = document.createElement('div');

type B = typeof div