类型体操的9种类型运算、4种类型套路总结

今天给大家分享的主题是一起来做类型体操。

主要分为 4 个部分进行介绍：

1.类型体操的背景，通过背景了解为什么要在项目中加入类型体操；
2.了解类型体操的主要类型、运算逻辑、和类型套路；
3.类型体操实践，解析 TypeScript 内置高级类型，手写 ParseQueryString 复杂类型；
4.小结，综上分享，沉淀结论。

一、背景

在背景章节介绍的是什么是类型，什么是类型安全，怎么实现类型安全，什么是类型体操？

以了解类型体操的意义。

1. 什么是类型？

了解什么是类型之前，先来介绍两个概念：

• 不同类型变量占据的内存大小不同

boolean 类型的变量会分配 4 个字节的内存，而 number 类型的变量则会分配 8 个字节的内存，给变量声明了不同的类型就代表了会占据不同的内存空间。

• 不同类型变量可做的操作不同

number 类型可以做加减乘除等运算，boolean 就不可以，复合类型中不同类型的对象可用的方法不同，比如 Date 和 RegExp，变量的类型不同代表可以对该变量做的操作就不同。

综上，可以得到一个简单的结论就是，类型就是编程语言提供对不同内容的抽象定义。

2. 什么是类型安全？

了解了类型的概念后，那么，什么是类型安全呢？

一个简单的定义就是，类型安全就是只做该类型允许的操作。比如对于 boolean 类型，不允许加减乘除运算，只允许赋值 true、false。

当我们能做到类型安全时，可以大量的减少代码中潜在的问题，大量提高代码质量。

3. 怎么实现类型安全？

那么，怎么做到类型安全？

这里介绍两种类型检查机制，分别是动态类型检查和静态类型检查。

3.1 动态类型检查

Javascript 就是典型的动态类型检查，它在编译时，没有类型信息，到运行时才检查，导致很多隐藏 bug。

3.2 静态类型检查

TypeScript 作为 Javascript 的超集，采用的是静态类型检查，在编译时就有类型信息，检查类型问题，减少运行时的潜在问题。

4. 什么是类型体操

上面介绍了类型的一些定义，都是大家熟悉的一些关于类型的背景介绍，这一章节回归到本次分享的主题概念，类型体操。

了解类型体操前，先介绍 3 种类型系统。

4.1 简单类型系统

简单类型系统，它只基于声明的类型做检查，比如一个加法函数，可以加整数也可以加小数，但在简单类型系统中，需要声明 2 个函数来做这件事情。

int add(int a, int b) {return a + b
}

double add(double a, double b) {return a + b
} 

4.2 泛型类型系统

泛型类型系统，它支持类型参数，通过给参数传参，可以动态定义类型，让类型更加灵活。

T add<T>(T a, T b) {return a + b
}

add(1, 2)
add(1.1, 2.2) 

但是在一些需要类型参数逻辑运算的场景就不适用了，比如一个返回对象某个属性值的函数类型。

function getPropValue<T>(obj: T, key) {return obj[key]
} 

4.3 类型编程系统

类型编程系统，它不仅支持类型参数，还能给类型参数做各种逻辑运算，比如上面提到的返回对象某个属性值的函数类型，可以通过 keyof、T[K] 来逻辑运算得到函数类型。

function getPropValue<T extends object, Key extends keyof T
>(obj: T, key: Key): T[Key] {return obj[key]
} 

总结上述，类型体操就是类型编程，对类型参数做各种逻辑运算，以产生新的类型。

之所以称之为体操，是因为它的复杂度，右侧是一个解析参数的函数类型，里面用到了很多复杂的逻辑运算，等先介绍了类型编程的运算方法后，再来解析这个类型的实现。

二、了解类型体操

熟悉完类型体操的概念后，再来继续了解类型体操有哪些类型，支持哪些运算逻辑，有哪些运算套路。

1. 有哪些类型

类型体操的主要类型列举在图中。TypeScript 复用了 JS 的基础类型