TS：声明合并

一、基础概念

声明合并是指编译器将针对同一名字的多个独立声明合并为单一声明。
合并后的声明同时拥有多个声明的特性。

二、声明合并的种类

1. 接口合并

接口合并的机制时将双方的成员放到一个同名的接口里;
接口里的非函数成员必须是唯一的，如果不唯一，必须是统一类型的；如果声明了同名的非函数成员但是类型不同，编译器就会报错；
```
interface Animal {name : string;age : number;
}
interface Animal {kind : string;
}let cat : Animal = {name : 'hellokitty',age : 5,kind : cat
}   // ok
```
对于函数成员，每个同名函数声明都会被当成这个函数的一个重载。

同时需要注意，后面声明的接口具有更高的优先级。

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;
}

这个规则有一个例外是当出现特殊的函数签名时，如果签名里有一个参数的类型是单一的字符串字面量（比如，不是字符串字面量的联合类型），那么它将会被提升到重载列表的最顶端。

interface Document {createElement(tagName : any) : Element;createElement(tagName : "div") : HTMLDivElement;
}interface Document {createElement(tagName : string) : HTMLELement;createElement(tagName : "p") : HTMLPElement;
}// 等同与interface Document {createElement(tagName: "div"): HTMLDivElement;createElement(tagName: "p"): HTMLPElement;createElement(tagName: string): HTMLElement;createElement(tagName: any): Element;
}

2. 合并命名空间

对于命名空间里导出成员的合并，如果当前已经存在给定名字的命名空间，那么后来的命名空间的导出成员会被加到已经存在的那个模块里。
```
namespace Animal {export class Cat { ... }export class Dog { ... }
}namespace Animal {export interface Motion {eat : (food : string)=>void;}
}
```
非导出成员仅在其原有的（合并前的）命名空间内可见。
从其它命名空间合并进来的成员无法访问非导出成员。

3. 命名空间与类的合并

命名空间可以与类进行合并，只要命名空间的定义符合即将合并的类的定义；
合并规则与上面 合并命名空间小节里讲的规则一致，我们必须导出命名空间里的类，好让合并的类能访问。
合并结果是一个类并带有一个内部类。你也可以使用命名空间为类增加一些静态属性。
```
class Album {label: Album.AlbumLabel;
}
namespace Album {export class AlbumLabel { }
}
```
除了内部类的模式，你在JavaScript里，创建一个函数稍后扩展它增加一些属性也是很常见的。 TypeScript使用声明合并来达到这个目的并保证类型安全。
```
function sayHelloTo(name : string) : string {return sanHelloTo.prefix + name + "!";
}namespace sayHelloTo {export let prefix = "Hello ";
}console.log(sayHelloTo("yivi"));
```

4. 命名空间与枚举的合并

命名空间可以用来扩展枚举：

enum Color {red = 1,green = 2,blue = 3
}namespace Color {export function mixColor (color : string){if(color == "yellow"){return Color.red + Color.green;}else if(color == "white"){return Color.red + Color.green + Color.blue;}else if(color == "cyan"){return Color.green + Color.blue;}}
}

三、非法合并

类无法与其他类合并！类无法与其他类合并！类无法与其他类合并！

TS：声明合并de妙处相关推荐

TypeScript 素描 - 模块解析、声明合并
模块解析模块解析有两种方式相对方式也就是以/或 ./或-/开头的,比如import jq from "/jq" 非相对方式比如 import model from ...
TypeScript模块系统、命名空间、声明合并
命名空间命名空间能有效避免全局污染.在ES6引入模块之后,命名空间就较少被提及了.如果使用了全局的类库,命名空间仍是一个好的解决方案. namespace Shape{const pi = Math ...
TS声明文件重点理解和使用技巧总结
TypeScript 是 JavaScript 的超集,相比 JavaScript,其最关键的功能是静态类型检查 (Type Guard).然而 JavaScript 本身是没有静态类型检查功能的,T ...
TypeScript（七）泛型、声明合并、扩展阅读
TypeScript(七)泛型.声明合并.扩展阅读文章目录 TypeScript(七)泛型.声明合并.扩展阅读 1. 泛型简单的例子多个类型参数泛型约束泛型接口泛型类泛型参数的默认类型 ...
TypeScript学习笔记-声明合并
类不能和其他的类或者变量合并 /*** 声明合并* 若两个接口中存在相同的参数,那么这些相同的参数必须有相同的类型* 若两个接口中存在相同的函数,那么同名的函数声明都会被当成这个函数的重载,且后面的接 ...
【Python网络爬虫实战篇】使用selenium+requests爬取下载高清源视频：关于爬取m3u8文件链接解析为ts视频合并成mp4视频的分析实战
这两天博主在摸鱼时,偶然间接触到了流媒体的概念,一时间来了兴致.再加上之前博主有着七.八年的视频制作经验,深知视频素材获取的不易.因此,打算利用自己所学的python网络爬虫的知识,通过编写代码实现获 ...
react-native 为本地js和开源库的js编写.d.ts声明文件
读书不觉已春深 !明日清明节在使用Typescript编写程序RN过程中遇到困扰,且不论react,不论在浏览器中,只论写react-native的APP,怎么使用 declare声明文件和 na ...
利用m3u8下载ts并合并成一个完整视频
我们在用网页看视频时,很多时候视频是下载不下来的,当然这里面有很多技术来防止我们下载视频,接下来我将破解使用m3u8格式来下载视频.一般情况下,我们使用浏览器中Network来查看服务器和本机的数据传 ...
TS声明文件——declare module——.d.ts文件
1.TS声明文件为什么有声明文件呢?(详细见 [菜鸟教程]) 因为TS直接引用第三方JS库的时候,虽然可以用,但是是没有类型检查,所以我们需要做一个声明文件,来声明这些第三方库的类型,这样在使用第三 ...
网页分段视频下载并将多个ts文件合并
一.生成0-599个数的txt文件 # with open 打开文件不用关闭 with open('1.txt', mode='a+', encoding='utf-8') as f:for i i ...

TS：声明合并de妙处

TS：声明合并

一、基础概念

二、声明合并的种类

1. 接口合并

2. 合并命名空间

3. 命名空间与类的合并

4. 命名空间与枚举的合并

三、非法合并

TS：声明合并de妙处相关推荐

最新文章

热门文章

TS：声明合并de妙处

TS：声明合并

一、基础概念

二、声明合并的种类

1. 接口合并

2. 合并命名空间

3. 命名空间与类的合并

4. 命名空间与枚举的合并

三、 非法合并

TS：声明合并de妙处相关推荐

最新文章

热门文章

三、非法合并