interface 與 對(duì)象
在typescript中,我們定義對(duì)象的方式要用到關(guān)鍵字 interface(接口),在個(gè)人的理解中,使用interface來定義一種約束,使數(shù)據(jù)結(jié)構(gòu)滿足定義的約束
// 會(huì)報(bào)錯(cuò),因?yàn)樵赑erson接口定義了a,b2個(gè)字段,但是在對(duì)象里面缺少b字段
// 使用接口約束的時(shí)候不能多一個(gè)字段不能少一個(gè)字段
// 必須和接口一致
interface Person {
a:string,
b:string
}
const person: Person = {
a: '123'
}
// 重名的interface 會(huì)產(chǎn)生合并
interface Person {
name: string
}
interface Person {
age: number
}
const user: Person = {
name: 'xhj',
age: 18
};
// 接口可以繼承
// 但是不允許有(同名的字段,類型不一樣)
interface Name {
name: string;
}
interface Age {
age: number;
}
interface Person extends Name, Age {
sex: string;
}
const person: Person = {
name: "xhj",
age: 18,
sex: "man",
};
可選屬性 使用?操作符
// 可選屬性的含義是該屬性可以不存在
// 所以說這樣寫也是沒問題的
interface Person {
b?:string,
a:string
}
const person:Person = {
a:"213"
}
任意屬性 [propName: string]
// 在這個(gè)例子當(dāng)中我們看到接口中并沒有定義C但是并沒有報(bào)錯(cuò)
// 應(yīng)為我們定義了[propName: string]: any;
// 允許添加新的任意屬性
interface Person {
b?:string,
a:string,
[propName: string]: any;
}
const person:Person = {
a:"213",
c:"123"
}
只讀屬性 readonly
// 這樣寫是會(huì)報(bào)錯(cuò)的
// 應(yīng)為a是只讀的不允許重新賦值
interface Person {
b?: string,
readonly a: string,
[propName: string]: any;
}
const person: Person = {
a: "213",
c: "123"
}
person.a = 123
添加函數(shù)
interface Person {
b?: string,
readonly a: string,
[propName: string]: any;
cb:()=>void
}
const person: Person = {
a: "213",
c: "123",
cb:()=>{
console.log(123)
}
}