TS中接口的概念

godfly
249 阅读3分钟

引言

  • 接口的基本概念就是用来描述数据的形状（对象、类、函数）
  • 接口中的东西都是抽象的，没有具体实现

示例

Image.png

可能有人会问，这里使用type也可以，那么我们就来总结一下type和interface的区别

  • 都能产生类型
  • type可以使用联合类型，而interface不可以
  • type不能被继承和实现，interface可以被继承、实现、扩展
  • interface中不能用in操作符，type是可以的
  • type不能重复定义和interface可以重复定义并合并

对象的赋值操作具备兼容性的特点

Image.png

  • 这种写法是会报错，因为你定义了一个类型IFruit，那么fruit值也必须满足这个类型

猥琐的用一个变量来进行赋值

Image.png

  • 这种就是赋值操作，通过兼容性赋值没有声明的属性，但是这种写法，fruit上你是取不到taste属性的，这是从安全性的角度上考虑的

那么我们还有什么方法可以把f对象赋上去呢？

  • 答案就是类型断言

Image.png

  • 我们可以用这个方法来把多的属性赋给少的

还有第三种方法

  • 可选属性，可以添加可以不添

Image.png

我们还可以再加一个接口，我们刚才说过同名接口可以合并，上面的全局的，下面的是我们文件自己的，不跟全局的混在一起

Image.png

  • 可以通过同名接口可以合并的特性来实现属性的拓展，一般在写声明文件的时候，希望扩展的时候可以这样操作

接口还可以拓展

  • 接口可以继承一个或多个接口

Image.png

  • 要求此接口继承于某个接口，再进行扩展

我们还有一种非常快速的方法

  • 因为我们不可能去一个一个的往上加，如果有非常多的扩展属性，那估计写到天亮了

Image.png

总结扩展的方法

  • 借助赋值兼容性问题
  • 断言的方式
  • 加？ 号的方式
  • extend扩展的方式

可索引类型

Image.png

  • 我们可以通过索引接口定义数组和数字映射表
  • 如果是字符串数字，它也可以识别成数字

原则

  • 能使用type就用type，不能用type的时候考虑interface

type和interface处理函数的区别

Image.png

Image.png

  • interface描述函数类型，中间要使用冒号

混合接口

Image.png

用接口描述类

Image.png

  • 用接口描述类上的方法，如果是eat():void，那么描述的就是原型上的
  • 如果是eat:()=>void，那么描述的是实例上的
  • 但是ts中识别不了是在类上的还是实例上的
  • 接口可以限制类中有哪些属性或方法

类还可以被接口继承

Image.png

抽象类

  • abstract关键字声明
  • 不能被实例化
  • 只能被继承
  • 可以在父类中定义抽象方法，子类必须要实现，如果是具象方法，子类可实现可不实现

Image.png

抽象类和接口的区别

  • 如果用接口来描述类，那接口定义的属性或方法都是抽象的，子类都要实现
  • 而抽象类中只有定义了抽象方法或属性，子类才必须要实现，具象属性和方法子类就可实现可不实现
avatar
文章
阅读
粉丝