继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

【备战春招】第8天 专为小白设计的TypeScript入门课——基础篇

邻you
关注TA
已关注
手记 8
粉丝 0
获赞 0

课程名称

课程章节

第2章 TypeScript 基础语法入门

  • 2-13 对象类型的补充学习

课程讲师

课程内容

  • 对象类型
    • 对象类型和对象解构的语法
    • interface中的readonly只读属性
    • 如何给对象扩展属性
    • 对象类型的继承
    • 多个对象类型同时进行继承
    • 交叉类型

课程收获

对象类型和对象解构的语法
这么写有问题,showPerson函数,接收一个对象进来,有两个属性,都有默认值。冒号nick和old,实际代表对象结构后变量换了一个名字。
图片描述
这样就没问题了。
图片描述
个语法与ts无关,是es6语法做对象解构的时候,可以把参数名称换掉。
注意:经常会把这种es6语法与ts的对象类型混为一谈。
如果想给对象进行类型定义 =>
这个时候不是别名就报错了。
图片描述
成功
图片描述

interface中的readonly只读属性
定义一个Person类的类型定义,之后初始化它的对象后,对象属性后面是可以修改的。
图片描述
假如要求属性不能修改了,则可使用readonly属性,一旦修改就会报错了。
图片描述
图片描述

如何给对象扩展属性
interface定义一个ArrayObject类,配置一个length属性。
图片描述
后期还想扩展属性 =》
直接加到对象中会报错。
图片描述
想约定扩展利用中括号形式,属性名类型和属性值类型定义好即可。
实际0也会被解析成字符串。
图片描述
属性名类型变为number就会报错了。
图片描述
实际0可以隐式转换字符串和数字,它与string和number都能匹配上,不过一般而言都会将属性类型为string类型的。
图片描述
属性类型值还可以加boolean。
图片描述

对象类型的继承
构建一个基础的Animal类
图片描述
派生一个dog类,利用extends语法。
图片描述
dog中不写name则会报错。
图片描述
对象继承可以帮助我们少写很多代码,加上一些理解,能够更好的语义化。

多个对象类型同时进行继承
要定义一个对象,它里既有Circle类型定义,又有Colorful类型定义。
图片描述
单独写一个类型约束肯定报错。
图片描述
可以借助interface和extends继承,一个类继承多个类型 =》
图片描述

交叉类型
利用type的交叉类型预发,可以替换多个对象类型同时进行继承。
图片描述

对象中只写一个属性也会报错。
图片描述

note:去应对复杂场景的继承,还是优先使用interface的语法,更容易理解,扩展性更好,也利于类型推断。
图片描述

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP