【TypeScript笔记】02 - TS高级类型

文章目录

导读

入门级TypeScript，《
黑马程序员前端TypeScript教程，TypeScript零基础入门到实战全套教程》https://www.bilibili.com/video/BV14Z4y1u7pi

开发环境

	版本号	描述
node -v	v14.18.3
npm -v	6.14.6
tsc -v	4.7.4
ts-node -v	10.9.1

class 类

class 基本用法

在这里插入图片描述

class 实例属性初始化

在这里插入图片描述

构造函数

在这里插入图片描述

类构造函数的原理

我们通过tsc将ts转换为js后对比结果如下：
在这里插入图片描述
运行结果如下：

khzdeMacBook-Pro:foo_ts khz$ ts-node class.ts
Person {
    
     name: 'lili', age: 18 }

我们可以看出，类的实现其实就是将class转换为一个函数；ts中类的构造函数，就是在函数中执行构造函数中的语句。

从运行结果中我们可以看出，类其实就是名为Person的对象。

类继承 - extends

在这里插入图片描述

类继承 - implements

在这里插入图片描述

类成员的可见性

public：公开的（默认可见性）
protected：受保护的，仅对其声明所在类及其子类中可见。（实例对象不可见）
private：私有的，只在当前类中可见

只读修饰符 readonly

在这里插入图片描述

类型兼容性

class 兼容

TS是Structural Type System(结构化类型系统)，类型检测关注的是类的形状。

相对的，C#、Java等都是Nominal Type System(标明类型系统)，const p: Point = new Point2D()这样的语句在C#中是会报错的。

成员多的可以赋值给成员少的：

接口兼容

class和interface之间也是可以兼容的

函数兼容

·函数兼容性比较复杂，需要考虑：

参数个数

参数类型

返回值类型

交叉类型

泛型和 keyof

在这里插入图片描述

`泛型函数`：创建、调用

简化泛型函数

泛型约束

多个泛型类型变量和 keyof

泛型接口

泛型类

在这里插入图片描述

泛型工具类型 - Partial

泛型工具类型 - Readonly

在这里插入图片描述

泛型工具类型 - Pick

在这里插入图片描述

泛型工具类型 - Record

在这里插入图片描述

索引签名类型

除此之外，上面的例子还包含了下面的约定：

对象obj的值不能是非number类型的。

映射类型

语法

基于联合类型in

基于对象类型in keyof

实战-`Partial<Type>`

索引查询（访问）类型

同时查询多个索引的类型：| 和 keyof

参考资料

《黑马程序员前端TypeScript教程》https://www.bilibili.com/video/BV14Z4y1u7pi
TypeScript 教程 https://www.runoob.com/typescript/ts-tutorial.html

【TypeScript笔记】02 - TS高级类型

文章目录

导读

开发环境

class 类

class 基本用法

class 实例属性初始化

构造函数

类构造函数的原理

类继承 - extends

类继承 - implements

类成员的可见性

只读修饰符 readonly

类型兼容性

class 兼容

接口 兼容

函数兼容

交叉类型

泛型 和 keyof

泛型函数：创建、调用

简化泛型函数

泛型约束

多个泛型类型变量 和 keyof

泛型接口

泛型类

泛型工具类型 - Partial

泛型工具类型 - Readonly

泛型工具类型 - Pick

泛型工具类型 - Record

索引签名类型

映射类型

语法

实战-Partial<Type>

索引查询（访问）类型

参考资料

猜你喜欢

接口兼容

泛型和 keyof

`泛型函数`：创建、调用

多个泛型类型变量和 keyof

实战-`Partial<Type>`