TypeScript-type注解对象类型

type注解对象类型

在TS中对于对象数据的类型注解，除了使用interface之外还可以使用类型别名来进行注解，作用类似

type Person = {
  name: string
  age: number
}

const p:Person = {
  name: 'lily',
  age: 16
}

type + 交叉类型&模拟继承

类型别名配合交叉类型(&)可以模拟继承，同样可以实现类型复用

// 父接口
type GoodsType = {
  id: string
  price: number
}

// 子接口继承
type DisGoodsType = GoodsType & {
  disPrice: number
}

let goods:DisGoodsType = {
  id: '01',
  price: 99,
  disPrice: 89
}
console.log(goods.price)

interface 对比 type

1️⃣ 相同点

• 都能描述对象类型

• 都能实现继承，interface 使用 extends，type 配合交叉类型&

2️⃣ 不同点

• type 除了能描述对象还可以用来自定义其它类型

• 同名的interface会合并(属性取并集，不能出现类型冲突)，同名type会报错

在注解对象类型的场景下非常相似，推荐 使用type,type更加灵活

Demo：

type Data = {
  title: string
  content: string
}

type ResData = {
  code: number
  msg: string
  data: Data
}

let res:ReaData = {
  code: 200,
  msg:'ok',
  data: {
    title:'文章标题',
    content:'文章内容'
  }
}

console.log(res.data.content)