耀极客论坛

 找回密码
 立即注册
查看: 631|回复: 0

TS中最常见的声明合并(接口合并)

[复制链接]

336

主题

318

帖子

22万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
220555
发表于 2022-5-7 01:13:00 | 显示全部楼层 |阅读模式
  这篇文章主要介绍了TS中最常见的声明合并:接口合并,TS中的声明合并,指的就是编译器会针对同名的声明合并为一个声明,合并后的声明会同时拥有原先两个或多个声明的特性,接口的合并也是一样,它会将双方的成员放到一个同名的接口里,更多详细内容请参考下面文章内容
  前言:
  今天要讲的内容还是TS相关,在TS中最常见的声明合并:接口合并
  在聊接口合并之前,我们先来聊聊声明合并
  声明合并:

  什么是声明合并?

  其实很好理解,TS中的声明合并,指的就是编译器会针对同名的声明合并为一个声明
  合并的结果:

  合并后的声明会同时拥有原先两个或多个声明的特性
  疑问:
那这两个或多个具体指的是什么呢?
  其实得分几种情况讲,今天要讲的就是其中一种,最简单也最常见的声明合并类型是接口合并

1.合并接口

  我们刚刚说了,“合并后的声明会同时拥有原先两个或多个声明的特性”
  接口的合并也是一样,它会将双方的成员放到一个同名的接口里
  需要注意的是,接口里面的成员有函数成员和非函数成员,情况有所不一样

1.1非函数成员

  例如:
  1. interface Box {
  2.     height: number;
  3. }
  4. interface Box {
  5.     width: number;
  6. }
  7. let box: Box = {height: 2, width: 3};
复制代码
  上述代码中,定义了两个名字都为Box的同名接口(实际开发中,可能来源于不同的文件),最终里面的东西会混合在一起
  但是需要注意,以上情况里头的成员都是唯一的,但如果两个接口中同时声明了同名的非函数成员且它们的类型不同,则编译器会报错

1.2函数成员

  而对于里头的函数成员来说,每个同名函数声明都会被当成这个函数的一个重载。而且当接口 A与后来的接口 A合并时,后面的接口具有更高的优先级
  例如官方的例子:
  1. interface Cloner {
  2.     clone(animal: Animal): Animal;
  3. }
  4. interface Cloner {
  5.     clone(animal: Sheep): Sheep;
  6. }
  7. interface Cloner {
  8.     clone(animal: Dog): Dog;
  9.     clone(animal: Cat): Cat;
  10. }
复制代码
  最终会合并成一个声明,如下:
  1. interface Cloner {
  2.     clone(animal: Dog): Dog;
  3.     clone(animal: Cat): Cat;
  4.     clone(animal: Sheep): Sheep;
  5.     clone(animal: Animal): Animal;
  6. }
复制代码
  需要注意两点:
       
  • 每组接口里的声明顺序不变   
  • 各组接口之间的顺序是后来的接口重载出现在靠前位置
  不过也有例外:当出现特殊的函数签名时。 如果签名里有一个参数的类型是单一的字符串字面量(比如,不是字符串字面量的联合类型),那么它将会被提升到重载列表的最顶端
  到此这篇关于TS中最常见的声明合并(接口合并)的文章就介绍到这了,更多相关TS中的接口合并内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!


回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|耀极客论坛 ( 粤ICP备2022052845号-2 )|网站地图

GMT+8, 2022-12-7 12:43 , Processed in 0.070907 second(s), 20 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表