TypeScript - Interfaces
关注于数据值的 ‘shape’的类型检查是TypeScript核心设计原则。这种模式有时被称为‘鸭子类型’或者‘结构子类型化’。 。 在TypeScript中接口interfaces的责任就是命名这些类型,而且还是你的代码之间或者是与外部项目代码的契约。
初见Interface理解interface的最好办法,就是写个hello world程序:
接口LabelledValue描述了上例中printLabel的所要求的类型对象。它依然代表包含一个label的字符串属性。可以看见我们利用‘shape’(行)描述了printLabel的传入参数要求。
可选的Properties有时不是所有定义在interface中的属性都是必须的。例如流行的”option bags”模式(option配置),使用者可以之传入部分定制化属性。如下面“option bags”模式:
带有可选属性的interface定义和c#语言很相似,以’?‘紧跟类型后边表示。
interface的可选属性可以限制那些属性是可用的,这部分能得到类型检查,以及智能感知。例如下例:
Interfaces为了描述对象能接收的数据形(shapes)的返回。对于interface不仅难呢过描述对象的属性,也能描述函数类型。
下面是定义的interface signature是一个接收两个string的输入参数,并返回boolean的函数类型:
我也可以使用函数类型的interface去描述我们的数据。下面演示如何将一个相同类型的函数赋值给interface:
对于函数参数的检查,会按照参数的顺序检查对应的类型是否匹配。同时也会检查函数的返回类型是否匹配,在这个函数我们期望返回boolean类型true/false, 如果返回的是numbers或者string,则类型检查系统会提示返回值类型不匹配。
类似于函数类型,TypeScript也可以描述数组类型。在数组类型中有一个’index’类型其描述数组下标的类型,以及返回值类型描述每项的类型,如下:
index的支持两种类型,分别是字符串和数值类型. 我们可以限制index的类型,同时也可以检查index项的返回值类型。
index的类型签名可以描述常用的数组或者是‘dictionary’(字典序)模式,这点会强制所有的属性都需要和其返回值匹配。下例中length属性不匹配这点,所以类型检查会给出一个错误:
实现interface
在C#和java中interface是很常使用的类型系统,其用来强制其实现类符合其契约。在TypeScript中同样也可以实现:
同样也可以在interface中实现函数类型的契约,并要求clas实现此函数。如下例的‘setTime’函数:
interface描述的的是class的公开(public)部分,而不是私有部分.
类static/instance区别当使用类和接口的时候,我们需要知道类有两种类型:static(静态)部分和instance(实例)部分。如果尝试一个类去实现一个带有构造签名的interface,TypeScript类型检查会提示你错误。
这是因为一个类去实现接口的时候,只有instance(实例)的部分才会被检查。而构造函数属于静态部分,所以不会被类型检查。
相反你可以直接在类中实现这些(static)静态部分,如下例:
interface的继承
和类一样,接口也能集成其他的接口。这相当于复制接口的所有成员。接口的集成是的我们可以自由的抽象和分离到可重用的组件。
混合式类型
如前边提到的一样,在interface几乎可以描述JavaScript世界的一切对象。因为JavaScript是一个动态,灵活的脚本语言,所以偶尔也希望一个对象能够描述一些多个类型.
下面是一个混合式描述函数,对象以及额外属性的实例:
TypeScript(四)接口interface使用详解 接口是TypeScript中一个非常重要的概念,在其他很多语言中已经有了并且被大量使用。本来这个章节我打算更新其他的内容,但是发现很多东西都依赖接口,所以我们先来学习一下接口相关的知识吧!
Typescript 接口 # 接口 TypeScript 的核心原则之一是对值所具有的结构进行类型检查。它有时被称做“鸭式辨型法”或“结构性子类型化”。 在 TypeScript 里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。
TypeScript 之 More on Functions TypeScript 的官方文档早已更新,但我能找到的中文文档都还停留在比较老的版本。所以对其中新增以及修订较多的一些章节进行了翻译整理。
TypeScript 之 Generics TypeScript 的官方文档早已更新,但我能找到的中文文档都还停留在比较老的版本。所以对其中新增以及修订较多的一些章节进行了翻译整理。
TypeScript 之 Class(下) TypeScript 的官方文档早已更新,但我能找到的中文文档都还停留在比较老的版本。所以对其中新增以及修订较多的一些章节进行了翻译整理。
TypeScript 之 Class(上) TypeScript 的官方文档早已更新,但我能找到的中文文档都还停留在比较老的版本。所以对其中新增以及修订较多的一些章节进行了翻译整理。
相关文章
- [Typescript] Typing a Function Composition with Overloads and Generics
- [Typescript] 95. Hard - Required Keys
- [Typescript] 56. Medium - Flip Arguments
- [Typescript] 48. Medium - EndsWith
- [Typescript] 21. Medium - Last of Array
- [Typescript] Recursion Type
- [Typescript Kaop-ts] Use AOP in Vue Components with TypeScript and Kaop-ts
- [TypeScript] Use the never type to avoid code with dead ends using TypeScript
- [Typescript] 138. Hard - SnakeCase
- [Typescript] 71. Medium - Trunc
- [Typescript] Tips: Create your own 'objectKeys' function using generics and the 'keyof' operator
- [Typescript] Step5. Local types override
- [Typescript] Use the Nullish Coalescing Operator in TypeScript (isNil)
- [Typescript v3.9] ts-expect-error
- [TypeScript] Collect Related Strings in a String Enum in TypeScript
- TypeScript 的 type predicates