ts接口 interface

概念:可以用來(lái)約束一個(gè)函數(shù),對(duì)象,以及類(lèi)的結(jié)構(gòu)和類(lèi)型

1.對(duì)象類(lèi)型的接口

//定義接口
interface ListItem{
    id:number;
    name:string
}
interface List {
    data:ListItem[]
}
function getListId(list:List) {
    list.data.forEach(item=>{
        console.log(item.id,item.name)
    })
}

//允許傳入的list有除了接口定義的其他值,但接口中規(guī)定的值必須要有
let list = {
    data:[
        {id:1,name:'hemff',age:13}
    ]
}
/*若直接傳人對(duì)象內(nèi)容(對(duì)象字面量),ts會(huì)對(duì)其余的值進(jìn)行類(lèi)型檢查,解決方法1:將內(nèi)容賦值給一個(gè)變量  2.添加類(lèi)型斷言 as+對(duì)象類(lèi)型 3.給接口添加[x:string]:any  */
getListId({
    data:[
        {id:1,name:'hemff',age:13}
    ]
} as List)

2.函數(shù)類(lèi)型的接口

//函數(shù)類(lèi)型的接口 (兩種定義方式)
// 第一種
interface Add{
    (x:number,y:number):number
}
// 第二種
// type Add = (x:number,y:number) => number

let add:Add = (a,b)=> { return a+b }

console.log(add(1,2)) //3

3.混合類(lèi)型的接口(一個(gè)接口既可以定義一個(gè)函數(shù),也可以定義一個(gè)對(duì)象)

//混合類(lèi)型接口
interface MixItf {
    ():void;
    msg:string;
    dosomething():void
}
function getMix(){
    let lib:MixItf = (() => {}) as MixItf;
    lib.msg = 'rose';
    lib.dosomething = () => {}
    return lib;
}
let getMix1 = getMix()
console.log(getMix1.msg) //rose
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容