TypeScript入门-接口

前端之家收集整理的这篇文章主要介绍了TypeScript入门-接口前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

大致介绍

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

接口

例子:

printLabel函数有一个参数,要求这个参数是个对象,并且有一个属性名为label的类型为string的属性

有时我们会传入多个参数,但是只检测指定的参数有没有

用接口来实现上面的例子:

注意:要用到关键字

interface

可选属性

有时接口里的属性不是必须的是可选的,那么只要加个?就可以了

上面的代码config:SquareConfig规定了函数参数, {color: string;area: numner}规定了函数返回值的类型

使用可选属性的好处:

1、可以对可能存在的属性进行定义

2、可以捕获访问不存在的属性时的错误

只读属性

如果向让一个值只读,不可以修改就可以使用readonly

TypeScript具有ReadonlyArray类型,它与Array相似,只是把怕有可变方法去掉了,因此可以确保数组创建后再也不能被修改

= a; ro[0] = 12; // error! ro.push(5); // error! ro.length = 100; // error! a = ro; // error!

额外的属性检查

看一个例子:

起初会认为这个是对的,接口定义了两个可选属性color和width。函数实际传入了width属性和一个接口没有定义的colour属性,但是这段代码会报错。

对象字面量会被特殊对待而且会经过额外属性检查,当将它们赋值给变量或作为参数传递的时候。 如果一个对象字面量存在任何“目标类型”不包含的属性时,你会得到一个错误

最好的解决办法就是添加一个字符串索引签名

函数类型

例子:

可索引的类型

可索引类型比如a[10]或obj['a']。 可索引类型具有一个索引签名,它描述了对象索引的类型,还有相应的索引返回值类型。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持编程之家!

原文链接:https://www.f2er.com/js/40334.html

猜你在找的JavaScript相关文章