掘金小册 TypeScript 全面进阶指南

最近，软件开发设计公司 The Software House 针对 2022 年前端市场状态的调查显示，84% 的受访者都在使用 TypeScript，43% 的受访者甚至认为 TypeScript 将超越 JavaScript 成为前端开发的主要语言。

无论 TypeScript 是否会超越 JavaScript，可以肯定的是，TypeScript 已被开发人员普遍接受，和 ES6 语法以及前端框架一起，被视为前端开发领域的基础工具。那 TypeScript 为什么越来越受欢迎，甚至有超越JavaScript 的势头呢？

TypeScript 为什么越来越受欢迎？

我们知道，JavaScript 一直以灵活性著称。在实际开发时，我们不需要确定一个变量的类型，就能直接访问可能并不存在的属性，所以无需为每一步操作都定义类型。在小型项目中，这种灵活性可以有效提高开发效率，帮助我们掌控全局。

但随着项目规模的增大，这些变量类型的数量也会成倍增加，你总有记错、遗漏的时候。此时，灵活性就变成了埋在项目内的定时炸弹。在《Top 10 JavaScript errors from 1000+ projects》 中，最常见的错误就是 Cannot read property ‘xxx’ of undefined、undefined is not a function 等。这些错误就是我们过度依赖灵活性的后果，一旦它们被触发，就会导致你的页面白屏、卡死，甚至崩溃。

要解决灵活性带来的隐患，我们需要的是类型。更准确地说，是项目开发时的类型检查能力。 TypeScript 通过易上手且功能强大的类型系统，为 JavaScript 提供了强大的类型检查能力。在类型的帮助下，我们无需实际运行代码，就能通过类型的流转观察到变量的值是如何改变的。

但是，想要获得类型的帮助，我们需要额外的类型代码。这会影响开发效率吗？会有影响，但更多是正向的。

首先，要实现类型的精确标注，我们并不一定需要大量的类型代码。就像你给变量 A 新增一些属性得到变量 B，你会不会完全重新声明这两个变量的值。在类型层面也是一样，变量 B 的类型会基于变量 A 的类型派生得到，它们并不是两个完全独立的类型。基于这一方式，我们就能让类型之间存在紧密的关联，减少冗余的类型代码。

其次，当项目规模增大到某一阈值后，这些类型代码会是你开发时最得力的助手，让你有底气大胆地进行各种逻辑操作，不需要先把这些值都打印出来确认一遍。同时，由于 TypeScript 强大的类型推导能力，随着你对变量进行各种操作，TypeScript 就会自动地推导出变量最终的类型。你只需要确保类型符合，最终的结果就是符合你预期的。而在你敲击下.来访问一个变量的属性时，TypeScript 也会将所有的属性展示出来供你挑选。这就是类型代码对开发效率的提升所在。

而在最终编译时，TypeScript 又会将这些类型代码抹除，还给你可以直接放进浏览器里跑的、纯粹的 JavaScript 代码。因此，TypeScript 确实不能提高应用程序的性能，因为最终运行的仍然是 JavaScript。

放眼于项目的整个生命周期，得益于严密的类型检查与如臂使指的类型推导，TypeScript 不仅避免了 JavaScript 灵活性可能会带来的隐患，还能让你在面对 Bug 时更快地定位问题，让程序跑得更稳定一些！从这个方面来说，TypeScript 对开发效率的提升是终身制的。

〖资源目录〗:

• ├──1.开篇：用正确的方式学习 TypeScript.md 10.85kb
• ├──10.结构化类型系统：类型兼容性判断的幕后.md 12.14kb
• ├──11.类型系统层级：从 Top Type 到 Bottom Type.md 17.84kb
• ├──12.类型里的逻辑运算：条件类型与 infer.md 21.45kb
• ├──13.内置工具类型基础：别再妖魔化工具类型了！.md 20.23kb
• ├──14.反方向类型推导：用好上下文相关类型.md 8.74kb
• ├──15.数类型：协变与逆变的比较.md 16.35kb
• ├──16.了解类型编程与类型体操的意义，找到平衡点.md 7.64kb
• ├──17.内置工具类型进阶：类型编程进阶.md 32.71kb
• ├──18.基础类型新成员：模板字符串类型入门.md 15.10kb
• ├──19.类型编程新范式：模板字符串工具类型进阶.md 25.56kb
• ├──2.工欲善其事：打造最舒适的 TypeScript 开发环境.md 15.56kb
• ├──20.工程层面的类型能力：类型声明、类型指令与命名空间.md 27.96kb
• ├──21.在 React 中愉快地使用 TypeScript：内置类型与泛型坑位.md 32.19kb
• ├──22.让 ESLint 来约束你的 TypeScript 代码：配置与规则集介绍.md 33.40kb
• ├──23.全链路 TypeScript 工具库，找到适合你的工具.md 12.33kb
• ├──24.说说 TypeScript 和 ECMAScript 之间那些事儿.md 21.20kb
• ├──25.装饰器与反射元数据：了解装饰器基本原理与应用.md 35.12kb
• ├──26.控制反转与依赖注入：基于装饰器的依赖注入实现.md 25.21kb
• ├──27.TSConfig 全解（上）：构建相关配置.md 31.74kb
• ├──28.TSConfig 全解（下）：检查相关、工程相关配置.md 33.80kb
• ├──29.基于 Prisma + NestJs 的 Node API ：前置知识储备.md 24.48kb
• ├──3.进入类型的世界：理解原始类型与对象类型.md 20.18kb
• ├──30.基于 Prisma + NestJs 的 Node API ：项目开发与基于 Heroku 部署.md 22.19kb
• ├──31.玩转 TypeScript AST：AST Checker 与 CodeMod.md 35.60kb
• ├──32.感谢相伴：是结束，也是开始.md 4.71kb
• ├──33.漫谈篇：面试中的 TypeScript.md 6.53kb
• ├──4.掌握字面量类型与枚举，让你的类型再精确一些.md 13.08kb
• ├──5.函数与 Class 中的类型：详解函数重载与面向对象.md 24.67kb
• ├──6.探秘内置类型：any、unknown、never 与类型断言.md 20.75kb
• ├──7.类型编程好帮手：TypeScript 类型工具（上）.md 17.89kb
• ├──8.类型编程好帮手：TypeScript 类型工具（下）.md 18.55kb
• └──9.类型编程基石：TypeScript 中无处不在的泛型.md 20.19kb