TS聲明合并是指將兩個或者兩個以上的具有相同名稱的獨立聲明合并成一個定義巴粪,且該定義具有所合并的聲明的所有功能通今。
TS聲明可分為:
- 合并接口聲明
- 合并命名空間
- 命名空間和類、函數(shù)肛根、枚舉合并
- 不可合并部分
- 模態(tài)擴展
- 全局?jǐn)U展
接口聲明合并
- 非函數(shù)成員接口合并
interface People {
name: string;
}
interface People {
age: number
}
//合并后的接口
interface People {
name: string,
age: number
}
- 函數(shù)成員合并
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;
}
//注意: 1.合并后接口屬性的排序方式:每組接口里的聲明順序保持不變辫塌,但各組接口之間的順序是后來的接口重載出現(xiàn)在靠前位置
2.如果接口的函數(shù)參數(shù)含有單個字符串文字類型,它將會排到重載列表的頂部
合并命名空間
namespace Animals {
export class Zebra {}
}
namespace Animals {
export interface Legged {
numberOfLegs: number;
}
export class Dog {}
}
//合并為
namespace Animals {
export interface Legged {
numberOfLegs: number;
}
export class Zebra {}
export class Dog {}
}
//注意:非導(dǎo)出成員僅在其原有的(合并前的)命名空間內(nèi)可見派哲。
//這就是說合并之后臼氨,從其它命名空間合并進(jìn)來的成員無法訪問非導(dǎo)出成員。
namespace Animal {
let haveMuscles = true;
export let havename = false;
export function animalsHaveMuscles() {
return haveMuscles;
}
}
namespace Animal {
export function doAnimalsHaveMuscles() {
//return haveMuscles; // Error,是不能訪問的因為 haveMuscles沒被導(dǎo)出
return havename;// OK芭届,havename被export導(dǎo)出
}
}
命名空間和類储矩、函數(shù)感耙、枚舉合并
命名空間和類的合并
class Album {
label: Album.AlbumLabel; //可訪問合并后導(dǎo)出的類
}
namespace Album {
export class AlbumLabel { }
}
命名空間和函數(shù)的合并
function buildLabel(name: string): string {
return buildLabel.prefix + name + buildLabel.suffix; //可訪問合并中的命名空間中的屬性
}
namespace buildLabel {
export let suffix = "";
export let prefix = "Hello, ";
}
console.log(buildLabel("Sam Smith"));
命名空間和枚舉合并
enum Color {
red = 1,
green = 2,
blue = 4
}
namespace Color {
export function mixColor(colorName: string): number {
if (colorName == "white") {
return Color.red + Color.green + Color.blue; //可以訪問合并的枚舉類型屬性
}
else if (colorName == "red") {
return Color.red ;
}
else if (colorName == "white") {
return Color.red + Color.blue;
}else{
return 1;
}
}
}
不可合并部分
TS中類不能與其他類或變量合并;詳細(xì)可以參考TypeScript中的Mixins椰苟;
模塊擴展
js中可在對象原型上拓展現(xiàn)有的屬性和方法抑月,TS中可以通過模塊擴展來實現(xiàn)
// observable.ts
export class Observable<T> {
// ... implementation left as an exercise for the reader ...
}
// map.ts
import { Observable } from "./observable";
declare module "./observable" {
interface Observable<T> {
map<U>(f: (x: T) => U): Observable<U>;
}
}
Observable.prototype.map = function (f) {
// ... another exercise for the reader
};
// consumer.ts
import { Observable } from "./observable";
import "./map";
let o: Observable<number>;
o.map((x) => x.toFixed());
全局?jǐn)U展
TS可以從模塊內(nèi)部將聲明添加到全局范圍:
// observable.ts
export class Observable<T> {
// ... still no implementation ...
}
declare global {
interface Array<T> {
toObservable(): Observable<T>;
}
}
Array.prototype.toObservable = function () {
// ...
};
添加后全局可使用Array.prototype.toObservable方法;