TS类型注解(下)


前言

提示:这里可以添加本文要记录的大概内容:

例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。


提示:以下是本篇文章正文内容,下面案例可供参考

三、TypeScript类型约束

(5)对象

1.概念
对象其实和数组类似,不是限制对象本身的类型,而是对对象属性类型进行限制。
在这里插入图片描述
2.对对象做类型限制的好处:
通过对象类型限制就可以让编辑器很方便的提示你当前对象的属性有哪些。在这里插入图片描述

3.对象函数类型限制的另一种写法:

在这里插入图片描述
4.对象中的可选属性如何定制
对象中的可选属性定制跟函数一样,使用“?”完成
在这里插入图片描述
注意如果调用可选属性去完成需求,必须使用?.操作符,因为可选属性可能不存在,当不存在的时候就会出现致命错误,TS的优势就是在编程阶段解决掉错误,所以,必须使用?.操作符。
5.对象中的自定义属性如何定制
对象中的虽然可以定制可选属性,但也是约束好某个属性可有可无,如在这里插入图片描述
果想在对象中定义一个自定义属性,可以使用对象的任意属性

[propNmae:string]:any

  • propName就是一个占位符,换成其他的变量名字也可以
  • :string是当前属性,是一个字符串类型
  • any表示任意类型的意思,因为TS规定:一旦定义了任意属性,那么确定属性和可选属性的类型都必须是任意属性的类型的子集

(6)接口(TS中对象类型的专属约束)

1.什么是接口类型
在TS中,一般会用接口(interface)对对象类型做专属约束
在面向对象语言中,接口(interface)是一个很重要的概念,他是对行为的抽象,而具体如何行动需要由类(classes)去实现(implement)
TypeScript中的接口是一个非常灵活的概念,除了可用于对类的一部分行为进行抽象以外,也用于对【对象的形状(shape)】进行描述
2.如何通过接口(interface)约束对象类型
接口如何定义
interface 接口名称{ 属性1:类型; 属性2:类型; }
建议:接口前面加上I关键词

在这里插入图片描述
总结

  1. 定义接口虽然也是花括号,但是接口不是对象,所以属性之间不需要通过逗号分隔!
  2. 接口大家看起来是不是和之前学习的类型别名差不多,但是他们有区别,等学完接口的基础知识点之后,在总结区别
    3.接口可以单独用来约束函数的形状
    在这里插入图片描述4.接口的多次声明
    在这里插入图片描述
    5.接口(interface)的继承

如果定义了一个 IPerson 接口,他具有人类的所有属性约束,现在想定义一个学生对象,那么学生对象中肯定有人类属性,并且还有一些自己独有的属性,当碰到这种情况的时候,就可以利用接口的继承,让学生的接口继承人类的接口,这样就不用在学生接口中重复定义人类信息了。
在这里插入图片描述

6.类型别名模拟接口(interface)的继承
在这里插入图片描述

7.类型别名模拟继承的功能扩展
能使用 & 符合链接多个约束,也可以使用 | 符号链接多个约束,表示必须要完全符合某一个约束,而另一个约束可以满足或者部分满足也可以
在这里插入图片描述
8.接口(interface)中的只读属性
如果你需要某个对象的属性只在第一次声明时生效,之后不允许修改,那么,可以通过关键词 readonly 实现。

在这里插入图片描述
9. 接口(interface)与类型别名约束对象的区别

  • 命名规范
    类型别名使用type关键词声明,并且名称唯一,不可重复
    接口使用interface关键词声明,可以重复
    类型别名中使用逗号分隔属性约束,接口中使用分号(或者不写)分隔约束。

  • 使用范围
    类型别名除了可以约束对象以外,还可以给他其他类型定义约束
    接口只可以约束对象

  • 继承
    接口支持继承
    类型别名虽然可以通过其他方式实现继承效果,但那不是继承

(7)TS中的扩展类型

1.元组(Tuple)
在TS中,数组类型只能约束类型,而元组则是一个可以约束类型和数量的类型

  • 语法
    let 变量: [类型1,类型2] = [值1,值2]
    在这里插入图片描述

  • 使用
    元组类型不仅能够约束类型和能约束个数,这在某些数据初始化时十分有用,比如你要一个存储这经纬度的数组,那么,元组就非常合适了
    在这里插入图片描述

  • 扩展
    元组也可以添加“越界元素”,但是必须是约束类型之一:
    在这里插入图片描述
    2. TS类型推论
    类型推论就是:TypeScript 会在没有明确的指定类型的时候推测出一个类型,这就是类型推论。
    类型推论会发生在两个位置:

  • 声明变量时

  • 在这里插入图片描述

  • 函数的返回值
    在这里插入图片描述
    3.字面量类型

  • 什么是字面量类型
    字面量类型就是将一个自定义内容当做类型使用。
    在这里插入图片描述

  • 字面量类型的特点
    字面量类型要求你对某一个变量做类型约束时,值必须和字面量类型是一致的
    在这里插入图片描述

  • 字面量类型的使用场景
    字面量类型经常和联合类型一起使用,起到约束值的取值范围的作用
    在这里插入图片描述
    4.枚举
    不仅起到了分类说明的作用,还能起到限制取值范围的作用。

  • 语法格式
    enum types { Mon, Tue, Wed, Thu }
    不仅可以作为类型约束使用,他还可以作为值去使用

枚举类型的值:console.log(types)
在这里插入图片描述
分类
(1)数字枚举
当值为数字时,此枚举类型可以成为数字枚举。
在这里插入图片描述
(2)字符串枚举
当值为字符串时,此枚举类型就是字符窜枚举
在这里插入图片描述
(3)异构枚举
异构枚举就是枚举类型的值有数字有字符串,不过这种枚举类型大家知道就好,异构枚举出现的情况非常的少
(4)常量枚举
常量枚举是枚举类型的一种定义方式,是在定义枚举类型的时候使用 const 关键词声明
在这里插入图片描述
常量枚举跟数字枚举或者字符串枚举使用方式一样,和他们的区别是:常量枚举会在编译阶段被删除.
枚举类型与字面量类型的一些区别
想要知道枚举类型与字面类型的一些区别,那么就要知道字面量类型存在的一些问题。
(1)使用字面量类型定义一些选项时,如果值的内容需要修改,字面量类型需要修改大量内容。
(2)从编译结果来看,字面量类型不会进入到编译结果,而枚举类型会进入到编译结果
5.any类型
any类型就相当于是没有类型约束,因为any类型的数据可以是任意数据类型的数据!所以,在项目中,除非迫不得已,否则不推荐使用any类型去定制类型约束
6.类型断言

  • 什么是类型断言
    类型断言就是手动指定一个值的类型!

  • 语法
    值 as 类型

  • 类型断言的用途
    1> 将一个联合类型断言为其中一个类型
    2> 将一个父类断言为更加具体的子类
    3> 将任何一个类型断言为 any
    4> 将 any 断言为一个具体的类型
    7.泛型

  • 什么是泛型
    泛型(Generics)是指在定义函数、接口或类的时候,不预先指定具体的类型,而在使用的时候再指定类型的一种特性。

  • 泛型的基本使用
    先来看一种情况,比如我定义函数,要求输入什么就输出什么:
    在这里插入图片描述
    解释一下这个案例中的知识点:
    1> 在函数名与小括号之间的表示定义了一个泛型T,这里泛型的名字可以随意定义,不是非要叫T。
    2> val:T 表示使用泛型T
    3> (val:T):T 也表示使用泛型T
    4> 调用函数时的 表示在给泛型赋值

总结:在调用函数时,给泛型赋值,那么使用泛型的位置就会以此值为准,不是非要写,可以省略;TS 会自动推断参数的类型。
泛型也是可以定义多个的,主要是应对多类型的情况

在这里插入图片描述
类型约束配合一个关键词 keyof 使用
在这里插入图片描述
让U继承与T中某一项,这样就可以不仅可以解决之前的错误,还可以在使用函数时,让函数具有属性提示功能

  • 泛型接口
    泛型接口就是在定义接口时,可以配合泛型,定制更具约束功能的接口
    在这里插入图片描述

  • 比如使用接口约束函数的形状

  • 在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值