全部 / 前端 / 技术 · 2022年9月12日 0

TypeScript – Object Types

广告位招租 (vx: ghostcode, 备注:网站广告)

object-type

除了原始类型,遇到最多的就是 Object 类型,定义一个对象类型就是列出其属性和值:

function printPoint(point:{x:number, y:number}) {
  console.log(point.x, point.y);
}

对象还可以指定某些属性为可选:

function printName(person: { first: string, last?: string }) {
  //...
}

printName({first:'zhangsan'})
printName({first:'zhangsan',last:'lisi'})

这里有一点需要注意:当对可选属性操作时,需要进行判断

function printName(person: { first: string, last?: string }) {
  if (person.last !== undefined) {
    console.log(person.last.toUpperCase());
  }
}

另一种方法:

function printName(person: { first: string, last?: string }){
  console.log(person.last?.toUpperCase())
}

还可以如下定义对象:

let p:{
    first:string,
    last?:string,
}

p = {
    first:'zhang',
    last:'lisi',
}

若此时我直接给 p 加一个不存在的属性:

p = {
    first:'zhang',
    last:'lisi',
    other:'ooo' // 报错:不存在 other 属性。
}

解决方法:

let p:{
    first:string,
    last?:string,
    [propName:string]:any,
}

这样再添加新属性就不会报错了!