interface和type的区别

即TypeScript中接口和类型别名的区别：

首先type是中文翻译过来叫类型别名，interface叫接口，大部分情况下用法是类似的，有细微的区别

• type是不仅可以表示基本类型，还可以表示对象类型，联合类型，交叉类型，元组类型等，interface只能表示对象类型
• interface存在声明合并的机制，而type没有

interface Article {
  title: string;
}

interface Article {
  description: string;
}

const article: Article = {
  title: 'test',
  description: 'test'
}
// interface声明合并

type Article = {
  title: string;
}

type Article = {
  description: string;
}
//  Error: Duplicate identifier 'Article'.

• type和interface存在索引签名问题

interface propType{
    [key: string] : string
}
let props: propType

type dataType1 = {
    title: string
}
interface dataType2 {
    title: string
}
const data1: dataType1 = {title: "订单页面"}
const data2: dataType2 = {title: "订单页面"}
props = data1

props = data2
// Error:类型“dataType1”不可分配给类型“propType”; 类型“dataType1”中缺少索引签名

我们发现dataType1和dataType2对应的类型一样，但是interface定义的就赋值失败，是什么原因呢？

使用interface去声明变量时，它们在那一刻类型并不是最终的类型。由于interface可以进行声明合并，所以总有可能将新成员添加到同一个interface定义的类型上，导致赋值失败。

• interface可以使用extends关键字继承interface或者type，但是type不能使用extends进行继承

interface继承interface

interface Shape {
  color: string;
}

interface PenStroke {
  penWidth: number;
}

interface Square extends Shape, PenStroke {
  sideLength: number;
}

let square = <Square>{};
square.color = "blue";
square.sideLength = 10;
square.penWidth = 5.0;

inerface继承type

type Shape = {
  color: string;
}

type PenStroke = {
  penWidth: number;
}

interface Square extends Shape, PenStroke {
  sideLength: number;
}

let square = <Square>{};
square.color = "blue";
square.sideLength = 10;
square.penWidth = 5.0;

type实现继承

// 这样继承是不行的
// type Student extends Person

// type继承interface
interface Person{
    name:string
}
type Student = Person & { stuNo: number }


// type继承type
type Person = {
    name:string
}
type Student = Person & { stuNo: number }