TypeScript接口

一、什么是接口?


TypeScript的核心原则之一是对值所具有的结构进行类型检查,它有时被称作“鸭式辨型法”或“结构性子类型化”。

在ts里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约

接口

上述代码的功能如下:

1. 创造了一个函数,该函数默认传入的参数应该是一个对象,该对象内部需要有一个name属性,且该name属性的值应该是一个字符串

2. 输出传入的对象里面的name属性的属性值

nameValue接口就好比一个名字,用来描述上面例子里的要求,它代表了一个有name属性且类型为string的对象

类型检查器不会去检查属性的顺序,只要相应的属性存在并且类型也是对的就可以

interface接口实现之可选属性


很多框架的API接口里面都给我们提供了一些可选的属性,用户可以选择是否输入该属性信息,无论输入或是不输入都不会报错

可选属性在应用“option bags”模式时很常用,即给函数传入参数对象中只有部分属性赋值了。

可选属性

带有可选属性的接口与普通的接口定义差不多,只是在可选属性名字定义的后面加上了一个?符号

interface接口实现之可选属性的优点


可选属性的好处:一是可以对可能存在的属性进行预定义;二是可以捕获引用了不存在的属性时的错误

当使用了可选属性之后,那么对于这传入的对象里面的属性的引用就会被限制,如果引用了接口里未定义的属性时,就会报错。

如果没有使用接口的话,那么引用不存在的属性时,是不会报错的

interface接口实现之只读属性


接口不仅可以用在函数的传参上,也可以用作其他语句,比如:一些对象属性只能在对象刚刚创建的时候修改其值,可以在属性名前用readonly来指定只读属性。


只读属性

最简单判断该用readonly还是const的方法是看要把它作为变量使用还是作为一个属性,做为变量使用的话用const,若做为属性使用readonly。

interface接口实现之property


[property:string] : number 规定了返回值为string类型的数据为number类型

property

实现传入多个参数,并且固定死数据的类型。

property

interface接口实现之函数描述


接口能描述JavaScript中对象拥有的各种各样的特性,除了描述带有属性的普通对象外,接口也可以描述函数类型。

函数描述

TypeScript在编译的时候,会对函数的参数会逐个进行检查,要求对应位置上的参数类型是兼容的。

如果你不想指定每一个参数的特定类型也可以不写,TypeScript的类型系统会自动根据接口推断出参数类型,函数的返回值类型是通过其返回值推断出来的,如果让这个函数返回数字或字符串,类型检查器会警告我们函数的返回值类型与接口中的定义到底匹不匹配。

interface接口实现之索引类型


TypeScript支持两种索引签名:字符串和数字,可以同时使用两种类型的索引,但是数字索引的返回值必须是字符串索引返回值类型的子类型

   这是因为当使用number来索引时,JavaScript会将它转换成string然后再去索引对象,也就是说用100(一个number)去索引等同于使用"100"(一个string)去索引,因此两者需要保持一致。

索引类型

可以将索引签名设置为只读,这样就防止了给某些特定的索引进行赋值。

索引类型

interface接口实现之“类class”类型


实现接口的关键字是implements(翻译为:执行)


注:constructor构造函数返回的是一个实例,不能return类型值出去

利用类接口的设计可以规范出一个标准类最起码所具备的属性和方法

interface接口实现之继承接口


和类一样,接口也可以相互继承。让我们能够从一个接口里赋值成员到另一个接口里,可以更灵活地将接口分割到可重用的模块里。

接口继承

一个接口也可以继承多个接口,创建出多个接口的合成接口,上面的代码运行结果是,一个调用Square接口的对象里必须有color,width,length属性。

继承多个接口


interface接口实现之混合类型


函数也是对象,所以可以在给一个函数制定一个接口,定义函数的传参和自定义的额外属性。

接口实现之混合类型

interface接口实现之接口继承类


简而言之便是接口继承类的所有成员属性,这样便是后代成员既有类的成员属性也有了接口的数据类型限定。

接口继承类

SelectableControl包含了Control的所有成员,包括私有成员state。

因为只有Control的子类才能够拥有一个声明于Control的私有成员state, 这对私有成员的兼容性是必需的,所以只能够是Control的子类们才能实现SelectableControl接口

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • TypeScript的核心原则之一是对值所具有的结构进行类型检查。 它有时被称做“鸭式辨型法”或“结构性子类型化”...
    2o壹9阅读 3,788评论 0 48
  • 接口是在面向对象编程中一种规范的定义,它定义了行为和动作的规范,起一种限制的作用,只限制传入到接口的数据 Type...
    浅忆_0810阅读 3,328评论 0 1
  • 日期:2019 年 8 月 29 日 typescript 接口 介绍 TypeScript的核心原则之一是对值所...
    五十岚色叶阅读 3,056评论 0 2
  • 1.接口一方面可以在面向对象编程中表示为行为的抽象,另外可以用来描述对象的形状;2.接口就是把一些类中共有的属性和...
    成熟稳重的李先生阅读 1,092评论 0 0
  • 什么是接口 接口是一系列抽象方法的声明,是一些方法特征的集合,这些方法都应该是抽象的,需要由具体的类去实现,然后第...
    泛酸的桂花酒阅读 1,319评论 0 0