TypeScript基础笔记——接口和对象类型(TS -- 3)

简介: interface类型


typescript 中,我们定义对象的方式要用关键字 interface(接口),小满的理解是使用 interface 来定义一种约束,让数据的结构满足约束的格式。

我的理解是interface是一个国企部门只招一个人的话,他们会针对走后门的那个人量身定制招聘要求,到面试的时候,这些条件少一个都不行,多了也不行,毕竟已经内定了,再叼、这些条件不仅满足了而且还会更多的技能也没用,别人就是不要你。(留下心酸的眼泪)

interface类型

interfaceA{

    readonlyname:string//这个readonly是只读属性,意思就是说只能读取,不能将其他值赋值给他

   age?:number//这个问号就是可选的意思,条件稍微宽松了一些,下面引用这个age的话有没有这个属性都可以,不会报错

}

letobj:A= {

   name="小满嗷嗷叫"//这里如果不写name就会报错,因为我们在上面定义了A类型集合,并且在这个变量中引入了(里面必须要有name属性且类型为字符串)

   age  =18

}

注意:这个规定的属性不能多也不能少,参考我上面的案例

可选属性 --  ?操作符

interfaceA{

    readonlyname:string

   age?:number//这个问号就是可选的意思,条件稍微宽松了一些,下面引用这个age的话有没有这个属性都可以,不会报错

}

letobj:A= {

   name="小满嗷嗷叫"

   age  =18//age写不写无所谓

}

任意属性 -- [propName:string]

需要注意的是,一旦定义了任意属性,那么确定属性和可选属性的类型都必须是它的类型的子集

interfacePerson{

   name:string,

   age?:number,

   [propName:stirng]:string|number//这个属性一旦定义了,引用这个Person的对象就能够写入任意属性,属性的形式主要看冒号后面你定义了什么类型,比如在这里定义的类型就是string和number类型,不是这两者的类型就会报错,包括在Person里面定义除了string跟number之外其他类型也会报错

   //可以理解为这个 [propName:stirng]任意属性的优先度相当高

   

   注意string与number中间的`|`符号,小飞棍来咯,这是联合类型,后面笔记会写,这里就当作将string和number类型关系到了一块,有点像逻辑或,满足联合起来的其中一个条件都行,两个也可以

}

只读属性 -- readonly

只读属性必须在声明时或构造函数里被初始化。

interfaceA{

    readonlyname:string//这个readonly是只读属性,意思就是说只能读取,不能将其他值赋值给他

}

letobj:A= {

   name="小满嗷嗷叫"

}

obj.name="小满芳龄18"//报错

console.log(obj)//能够读取

letname1=obj.name

console.log(name1)

继承属性 -- extends

儿子在前面,父亲在后面。也就是说顺序是 儿子 继承于 父亲

父亲的部分会继承给儿子,父亲的部分如果没有使用?操作符的话,引用儿子的 对象 是必须将父亲的部分都写下去。一说到这个就想到现在有的地方买房子,出政策能够绑定3代人一起还款,父债子还,跑不掉的,连债务都继承了还不能摆脱,这政策太鸡儿黑心了,绝户计

interfaceA{

   name:string

}

interfaceBextendsA{

   age:number

}

letp:B{

   name:"有看到小满的裤子吗?"

   age:88//两种类型都要写

}


目录
相关文章
|
2月前
|
JavaScript
​​​​Typescript 接口 和继承 数组处理
ts的基础数据类型,可用来处理一般数据,但是碰到后台传入的复杂对象数组的时候,我们可以使用ts中的接口来定义处理
43 0
|
2月前
|
JavaScript 前端开发 C++
Typescript.中文.接口声明.lib.es5.d.ts
Typescript.中文.接口声明.lib.es5.d.ts
31 0
|
5天前
|
JavaScript 开发者 索引
TypeScript接口与类型别名:深入解析与应用实践
【7月更文挑战第10天】TypeScript的接口和类型别名是定义类型的关键工具。接口描述对象结构,用于类、对象和函数参数的形状约束,支持可选、只读属性及继承。类型别名则为复杂类型提供新名称,便于重用和简化。接口适合面向对象场景,类型别名在类型重用和复杂类型简化时更有优势。选择时要考虑场景和灵活性。
|
9天前
|
JavaScript 前端开发 程序员
Typescript 【实用教程】(2024最新版)含类型声明,类型断言,函数,接口,泛型等
Typescript 【实用教程】(2024最新版)含类型声明,类型断言,函数,接口,泛型等
11 0
|
13天前
|
JavaScript Java 索引
TypeScript(四)接口
TypeScript(四)接口
14 0
|
13天前
|
存储 JavaScript 前端开发
TypeScript(三)对象类型
TypeScript(三)对象类型
13 0
|
13天前
|
JavaScript API
TypeScript 项目中接口的统一管理
TypeScript 项目中接口的统一管理
13 0
|
1月前
|
JavaScript 索引 前端开发
9.【TypeScript 教程】接口(Interface)
9.【TypeScript 教程】接口(Interface)
16 4
|
18天前
|
JavaScript 前端开发 程序员
typescript入门笔记分享
typescript入门笔记分享
13 0
|
1月前
|
JavaScript 编译器
TypeScript 接口
TypeScript 接口