接口：interface

  1. interface Props {}

类型别名：type alias

  1. type Props = {}

接口和类型别名的区别

  1. // 一致的：接口和类型别名都可以描述对象的形状和函数签名
  2. interface Shape {
  3.   x: number;
  4.   y: number;
  5. }
  7. interface Func = {
  8.   (x: number, y: number): void;
  9. }
  11. type Shape = {
  12.   x: number;
  13.   y: number;
  14. }
  16. type Func = (x: number, y: number) : void;
  18. // 不一致的：类型别名可以使用基本类型
  19. type Num = number;
  23. // 联合类型
  24. type PointX = { x: number };
  25. type PointY = { y: number };
  26. type Pnint = PointX & PointY;
  28. // 类型别名可以使用元祖
  29. type Tuple = [number, number]

继承

接口和类型别名都可以使用继承，但写法不一致，此外接口和类型别名不是互斥，接口可以继承类型别名，但类型别名不可以使用extends继承接口可以使用&合并。

  1. // interface extends interface
  2. interface Persion {
  3.     name: string;
  4.     age: number;
  5. }
  6. // 学生类继承人类
  7. interface Student extends Persion {
  8.     num: number;
  9. }
  1. // 类型别名继承类型别名
  2. type Persion = {
  3.     name: string;
  4.     age: number;
  5. }
  7. type Student =  {
  8.     num: number;
  9. } & Persion;
  1. // 类型别名继承接口
  2. interface Persion {
  3.     name: string;
  4.     age: number;
  5. }
  7. type Student =  {
  8.     num: number;
  9. } & Persion;

实现 implements

类可以实现接口或类型别名，但不是实现类型别名的联合类型

  1. interface Persion {
  2.     name: string;
  3.     age: number;
  4. }
  6. class jeff implements Persion {
  7.     name = 'jeff';
  8.     age = 12;
  9. }
  11. type Persion2 = {
  12.     name: string;
  13.     age: number;
  14. }
  16. class jeff2 implements Persion2 {
  17.      name = 'jeff';
  18.     age = 12;
  19. }
  21. type Persion3 = { name: string } | { age: number};
  23. // A class can only implement an object type or intersection of object types with statically known members.
  24. // 类只能实现对象类型或对象类型与静态已知成员的交集。
  25. class jeff3 implements Persion3 {
  26.     name = 'jeff3'
  27.     age = 12
  28. }

接口声明合并

和类型别名不同，接口可以定义多次，会被自动合并为单个接口

  1. interface Point { x: number; }
  2. interface Point { y: number; }
  3. const point: Point = { x: 1, y: 2 };