【TypeScript】TypeScript的接口和对象类型(interface):
创始人
2024-05-26 09:21:50
0

文章目录

        • 一、使用接口约束的时候不能多一个属性也不能少一个属
        • 二、重名interface 可以合并,继承
        • 三、可选属性 使用?操作符
        • 四、任意属性 [propName: string]
        • 五、只读属性 readonly,是不允许被赋值的只能读取
        • 六、添加函数


一、使用接口约束的时候不能多一个属性也不能少一个属

//这样写是会报错的 因为我们在person定义了a,b但是对象里面缺少b属性
//使用接口约束的时候不能多一个属性也不能少一个属性
//必须与接口保持一致
interface Person {b:string,a:string
}const person:Person  = {a:"213"
}

二、重名interface 可以合并,继承

//重名interface  可以合并
interface A{name:string}
interface A{age:number}
var x:A={name:'xx',age:20
}//继承
interface A{name:string
}interface B extends A{age:number
}let obj:B = {age:18,name:"string"
}

三、可选属性 使用?操作符

//可选属性的含义是该属性可以不存在
//所以说这样写也是没问题的
interface Person {b?:string,a:string
}const person:Person  = {a:"213"
}

四、任意属性 [propName: string]

需要注意的是,一旦定义了任意属性,那么确定属性和可选属性的类型都必须是它的类型的子集:

//在这个例子当中我们看到接口中并没有定义C但是并没有报错
//应为我们定义了[propName: string]: any;
//允许添加新的任意属性
interface Person {b?:string,a:string,[propName: string]: any;
}const person:Person  = {a:"213",c:"123"
}

五、只读属性 readonly,是不允许被赋值的只能读取

//这样写是会报错的
//应为a是只读的不允许重新赋值
interface Person {b?: string,readonly a: string,[propName: string]: any;
}const person: Person = {a: "213",c: "123"
}person.a = 123

六、添加函数

interface Person {b?: string,readonly a: string,[propName: string]: any;cb:()=>void
}const person: Person = {a: "213",c: "123",cb:()=>{console.log(123)}
}

相关内容

热门资讯

中证A500ETF摩根(560... 8月22日,截止午间收盘,中证A500ETF摩根(560530)涨1.19%,报1.106元,成交额...
A500ETF易方达(1593... 8月22日,截止午间收盘,A500ETF易方达(159361)涨1.28%,报1.104元,成交额1...
何小鹏斥资约2.5亿港元增持小... 每经记者|孙磊    每经编辑|裴健如 8月21日晚间,小鹏汽车发布公告称,公司联...
中证500ETF基金(1593... 8月22日,截止午间收盘,中证500ETF基金(159337)涨0.94%,报1.509元,成交额2...
中证A500ETF华安(159... 8月22日,截止午间收盘,中证A500ETF华安(159359)涨1.15%,报1.139元,成交额...
科创AIETF(588790)... 8月22日,截止午间收盘,科创AIETF(588790)涨4.83%,报0.760元,成交额6.98...
创业板50ETF嘉实(1593... 8月22日,截止午间收盘,创业板50ETF嘉实(159373)涨2.61%,报1.296元,成交额1...
港股异动丨航空股大幅走低 中国... 港股航空股大幅下跌,其中,中国国航跌近7%表现最弱,中国东方航空跌近5%,中国南方航空跌超3%,美兰...
电网设备ETF(159326)... 8月22日,截止午间收盘,电网设备ETF(159326)跌0.25%,报1.198元,成交额409....
红利ETF国企(530880)... 8月22日,截止午间收盘,红利ETF国企(530880)跌0.67%,报1.034元,成交额29.0...