TS中最常見的聲明合并(接口合并)
前言:
今天要講的內(nèi)容還是TS相關(guān),在TS中最常見的聲明合并:接口合并
在聊接口合并之前,我們先來聊聊聲明合并
聲明合并:
什么是聲明合并?
其實(shí)很好理解,TS中的聲明合并,指的就是編譯器會針對同名的聲明合并為一個聲明
合并的結(jié)果:
合并后的聲明會同時擁有原先兩個或多個聲明的特性
疑問:
那這兩個或多個具體指的是什么呢?
其實(shí)得分幾種情況講,今天要講的就是其中一種,最簡單也最常見的聲明合并類型是接口合并
1.合并接口
我們剛剛說了,“合并后的聲明會同時擁有原先兩個或多個聲明的特性”
接口的合并也是一樣,它會將雙方的成員放到一個同名的接口里
需要注意的是,接口里面的成員有函數(shù)成員和非函數(shù)成員,情況有所不一樣
1.1非函數(shù)成員
例如:
interface Box { height: number; } interface Box { width: number; } let box: Box = {height: 2, width: 3};
上述代碼中,定義了兩個名字都為Box
的同名接口(實(shí)際開發(fā)中,可能來源于不同的文件),最終里面的東西會混合在一起
但是需要注意,以上情況里頭的成員都是唯一的,但如果兩個接口中同時聲明了同名的非函數(shù)成員且它們的類型不同,則編譯器會報錯
1.2函數(shù)成員
而對于里頭的函數(shù)成員來說,每個同名函數(shù)聲明都會被當(dāng)成這個函數(shù)的一個重載。而且當(dāng)接口 A與后來的接口 A合并時,后面的接口具有更高的優(yōu)先級
例如官方的例子:
interface Cloner { clone(animal: Animal): Animal; } interface Cloner { clone(animal: Sheep): Sheep; } interface Cloner { clone(animal: Dog): Dog; clone(animal: Cat): Cat; }
最終會合并成一個聲明,如下:
interface Cloner { clone(animal: Dog): Dog; clone(animal: Cat): Cat; clone(animal: Sheep): Sheep; clone(animal: Animal): Animal; }
需要注意兩點(diǎn):
- 每組接口里的聲明順序不變
- 各組接口之間的順序是后來的接口重載出現(xiàn)在靠前位置
不過也有例外:當(dāng)出現(xiàn)特殊的函數(shù)簽名時。 如果簽名里有一個參數(shù)的類型是單一的字符串字面量(比如,不是字符串字面量的聯(lián)合類型),那么它將會被提升到重載列表的最頂端
到此這篇關(guān)于TS中最常見的聲明合并(接口合并)的文章就介紹到這了,更多相關(guān)TS中的接口合并內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
js實(shí)現(xiàn)電梯導(dǎo)航效果的示例代碼
這篇文章主要介紹了JavaScript實(shí)現(xiàn)電梯導(dǎo)航效果的相關(guān)知識,文中通過示例代碼介紹的很詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)吧2023-12-12仿淘寶TAB切換搜索框搜索切換的相關(guān)內(nèi)容
這是一款仿淘寶TAB切換搜索框,想搜索哪方面的內(nèi)容就切換到哪一個,非常實(shí)用,喜歡的朋友可以看看2014-09-09input標(biāo)簽內(nèi)容改變的觸發(fā)事件介紹
onchange事件在內(nèi)容改變(兩次內(nèi)容有可能相等)且失去焦點(diǎn)時觸發(fā);onpropertychange事件是實(shí)時觸發(fā),每增加或刪除一個字符就會觸發(fā)2014-06-06使用insertAfter()方法在現(xiàn)有元素后添加一個新元素
為javascript添加insertAfter()方法即在現(xiàn)有元素后添加一個新元素,示例如下,大家不妨學(xué)習(xí)下2014-05-05javascript函數(shù)中參數(shù)傳遞問題示例探討
本節(jié)主要與大家探討下javascript函數(shù)中參數(shù)傳遞問題,有不明白的朋友可以參考下2014-07-07javascript實(shí)現(xiàn)的彈出層背景置灰-模擬(easyui dialog)
本文為大家介紹下使用javascript實(shí)現(xiàn)的彈出層背景置灰-模擬(easyui dialog) 具體實(shí)現(xiàn)如下,感興趣的朋友可以參考下2013-12-12