在TypeScript中,合并接口(Interface Merging)是一種強大的特性,它允許你擴展現有的接口,無論是通過聲明合并還是在同一個聲明塊中直接擴展。這種特性在基于類的面向對象編程中非常有用,但TypeScript的接口合并也適用于函數、枚舉等。
1. 在同一個聲明中合并接口
你可以在同一接口聲明中直接添加新的屬性或方法。然而,這并不是通常所說的“合并接口”,因為它不涉及多個接口聲明的合并。不過,了解這一點有助于理解接口擴展的基礎。
interface Animal {name: string;eat(): void;
}// 這不是合并接口,但展示了如何擴展接口
interface Animal {sleep(): void;
}// 現在Animal接口包含 name, eat, 和 sleep
注意:在TypeScript中,如果接口名相同,則后聲明的接口會覆蓋前聲明的同名屬性或方法(如果有沖突的話),但這并不是合并接口的典型用法。
2. 聲明合并接口
聲明合并允許你將多個接口聲明合并為一個單一的接口。這是通過為相同的接口名創建多個接口聲明來實現的,每個聲明都貢獻了一些新的成員。
interface Box {height: number;width: number;
}interface Box {scale(n: number): Box;
}// 合并后的Box接口
let box: Box = {height: 5, width: 6, scale: (n) => box};
在這個例子中,Box
接口首先被定義為包含height
和width
屬性。然后,我們再次聲明了Box
接口,這次添加了scale
方法。最終,Box
接口將包含height
、width
和scale
方法。
3. 合并全局接口
你還可以合并全局作用域中的接口,這在為現有的庫或全局對象添加類型定義時特別有用。
interface Array<T> {myConcat(...items: T[][]): T[];
}Array.prototype.myConcat = function<T>(this: T[], ...items: T[][]): T[] {return [...this, ...items.flat()];
};const myArray = [1, 2, 3];
console.log(myArray.myConcat([4, 5], [6])); // 輸出: [1, 2, 3, 4, 5, 6]
在這個例子中,我們通過為Array
接口添加一個新的myConcat
方法來擴展了全局的Array
接口。注意,我們還需要在全局作用域中(例如,通過修改Array.prototype
)實現這個方法,以便在運行時可用。
注意事項
- 合并接口時,如果兩個接口中有同名的屬性或方法,則后聲明的接口中的屬性或方法會覆蓋前聲明的。
- 合并全局接口時要特別小心,因為這會影響到所有使用該全局接口的代碼。
- TypeScript的接口合并特性提供了一種靈活的方式來擴展和自定義現有類型,而無需修改原始定義。