前言

对于有 JavaScript 基础的同学来说，入门 TypeScript 其实很容易，只需要简单掌握其基础的类型系统就可以逐步将 JS 应用过渡到 TS 应用。

// jsconst double = (num) => 2 * num// tsconst double = (num: number): number => 2 * num

然而，当应用越来越复杂，我们很容易把一些变量设置为 any 类型，TypeScript 写着写着也就成了 AnyScript。为了让大家能更加深入的了解 TypeScript 的类型系统，本文将重点介绍其高级类型，帮助大家摆脱 AnyScript。

泛型

在讲解高级类型之前，我们需要先简单理解泛型是什么。

泛型是强类型语言中比较重要的一个概念，合理的使用泛型可以提升代码的可复用性，让系统更加灵活。下面是维基百科对泛型的描述：

泛型允许程序员在强类型程序设计语言中编写代码时使用一些以后才指定的类型，在实例化时作为参数指明这些类型。

泛型通过一对尖括号来表示( <> )，尖括号内的字符被称为 类型变量 ，这个变量用来表示类型。

function copy<T>(arg: T): T { if (typeof arg === 'object') { return JSON.parse( JSON.stringify(arg) ) } else { return arg }}

这个类型 T，在没有调用 copy 函数的时候并不确定，只有调用 copy 的时候，我们才知道 T 具体代表什么类型。

const str = copy<string>('my name is typescript')

我们在 VS Code 中可以看到 copy 函数的参数以及返回值已经有了类型，也就是说我们调用 copy 函数的时候，给类型变量 T 赋值了 string。其实，我们在调用 copy 的时候可以省略尖括号，通过 TS 的类型推导是可以确定 T 为 string 的。

高级类型

除了 string、number、boolean 这种基础类型外，我们还应该了解一些类型声明中的一些高级用法。

交叉类型（&）

交叉类型说简单点就是将多个类型合并成一个类型，个人感觉叫做「合并类型」更合理一点，其语法规则和逻辑 “与” 的符号一致。

T & U

假如，我现在有两个类，一个按钮，一个超链接，现在我需要一个带有超链接的按钮，就可以使用交叉类型来实现。

interface Button { type: string text: string}interface Link { alt: string href: string}const linkBtn: Button & Link = { type: 'danger', text: '跳转到百度', alt: '跳转到百度', href: 'http://pleted: false}

总结

如果只是掌握了 TypeScript 的一些基础类型，可能很难游刃有余的去使用 TypeScript，而且最近 TypeScript 发布了 4.0 的版本新增了更多功能，想要用好它只能不断的学习和掌握它。希望阅读本文的朋友都能有所收获，摆脱 AnyScript。

到此这篇关于你不知道的 TypeScript 高级类型(小结)的文章就介绍到这了,更多相关TypeScript 高级类型内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持！