lucifer

TypeScript 的学习资料非常多，其中也不乏很多优秀的文章和教程。但是目前为止没有一个我特别满意的。原因有：

• 它们大多数没有一个清晰的主线，而是按照 API 组织章节的，内容在逻辑上比较零散。
• 大多是“讲是什么，怎么用“，而不是”讲为什么，讲原理“。
• 大多数内容比较枯燥，趣味性比较低。都是干巴巴的文字，没有图片，缺乏能够引起强烈共鸣的例子。

因此我的想法是做一套不同市面上大多数的 TypeScript 学习教程。以人类认知的角度思考问题，学习 TypeScript，通过通俗易懂的例子和图片来帮助大家建立 TypeScript 世界观。

系列安排：

• 上帝视角看 TypeScript
• TypeScript 类型系统
• types 和 @types 是什么？
• 你不知道的 TypeScript 泛型（万字长文，建议收藏）
• TypeScript 配置文件该怎么写？
• TypeScript 是如何与 React，Vue，Webpack 集成的？
• TypeScript 练习题(第一弹)

目录将来可能会有所调整。

注意，我的系列文章基本不会讲 API，因此需要你有一定的 TypeScript 使用基础，推荐两个学习资料。

• 深入理解 TypeScript
• TypeScript 官方文档

结合这两个资料和我的系列教程，掌握 TypeScript 指日可待。

接下来，我们通过几个方面来从宏观的角度来看一下 TypeScript。

TypeScript 的学习资料非常多，其中也不乏很多优秀的文章和教程。但是目前为止没有一个我特别满意的。原因有：

• 它们大多数没有一个清晰的主线，而是按照 API 组织章节的，内容在逻辑上比较零散。
• 大多是“讲是什么，怎么用“，而不是”讲为什么，讲原理“。
• 大多数内容比较枯燥，趣味性比较低。都是干巴巴的文字，没有图片，缺乏能够引起强烈共鸣的例子。

因此我的想法是做一套不同市面上大多数的 TypeScript 学习教程。以人类认知的角度思考问题，学习 TypeScript，通过通俗易懂的例子和图片来帮助大家建立 TypeScript 世界观。

系列安排：

• 上帝视角看 TypeScript
• TypeScript 类型系统
• types 和 @types 是什么？
• 你不知道的 TypeScript 泛型（万字长文，建议收藏）
• TypeScript 配置文件该怎么写？
• TypeScript 是如何与 React，Vue，Webpack 集成的？
• TypeScript 练习题（就是本文）

目录将来可能会有所调整。

注意，我的系列文章基本不会讲 API，因此需要你有一定的 TypeScript 使用基础，推荐两个学习资料。

• 深入理解 TypeScript
• TypeScript 官方文档

结合这两个资料和我的系列教程，掌握 TypeScript 指日可待。

接下来，我们通过几个方面来从宏观的角度来看一下 TypeScript。

TypeScript 的学习资料非常多，其中也不乏很多优秀的文章和教程。但是目前为止没有一个我特别满意的。原因有：

• 它们大多数没有一个清晰的主线，而是按照 API 组织章节的，内容在逻辑上比较零散。
• 大多是“讲是什么，怎么用“，而不是”讲为什么，讲原理“。
• 大多数内容比较枯燥，趣味性比较低。都是干巴巴的文字，没有图片，缺乏能够引起强烈共鸣的例子。

因此我的想法是做一套不同市面上大多数的 TypeScript 学习教程。以人类认知的角度思考问题，学习 TypeScript，通过通俗易懂的例子和图片来帮助大家建立 TypeScript 世界观。

系列安排：

• 上帝视角看 TypeScript（已发布）
• TypeScript 类型系统（已发布）
• types 和 @types 是什么？（已发布）
• 你不知道的 TypeScript 泛型（万字长文，建议收藏）（已发布）
• TypeScript 配置文件该怎么写？（就是本文）
• TypeScript 是如何与 React，Vue，Webpack 集成的？
• TypeScript 练习题

目录将来可能会有所调整。

注意，我的系列文章基本不会讲 API，因此需要你有一定的 TypeScript 使用基础，推荐两个学习资料。

• 深入理解 TypeScript
• 官方文档

结合这两个资料和我的系列教程，掌握 TypeScript 指日可待。

接下来，我们通过几个方面来从宏观的角度来看一下 TypeScript。

TypeScript 的学习资料非常多，其中也不乏很多优秀的文章和教程。但是目前为止没有一个我特别满意的。原因有：

• 它们大多数没有一个清晰的主线，而是按照 API 组织章节的，内容在_逻辑上_比较零散。
• 大多是“讲是什么，怎么用“，而不是”讲为什么，讲原理“。
• 大多数内容比较枯燥，趣味性比较低。都是干巴巴的文字，没有图片，缺乏能够引起强烈共鸣的例子。

因此我的想法是做一套不同市面上大多数的 TypeScript 学习教程。以人类认知的角度思考问题，学习 TypeScript，通过通俗易懂的例子和图片来帮助大家建立 TypeScript 世界观。

系列安排：

• 上帝视角看 TypeScript（已发布）
• TypeScript 类型系统（已发布）
• types 和 @types 是什么？（就是本文）
• 你不知道的 TypeScript 泛型（万字长文，建议收藏）（已发布）
• TypeScript 配置文件该怎么写？
• TypeScript 是如何与 React，Vue，Webpack 集成的？
• TypeScript 练习题

目录将来可能会有所调整。

注意，我的系列文章基本不会讲 API，因此需要你有一定的 TypeScript 使用基础，推荐两个学习资料。

• 深入理解 TypeScript
• 官方文档

结合这两个资料和我的系列教程，掌握 TypeScript 指日可待。

接下来，我们通过几个方面来从宏观的角度来看一下 TypeScript。

TypeScript 的学习资料非常多，其中也不乏很多优秀的文章和教程。但是目前为止没有一个我特别满意的。原因有：

• 它们大多数没有一个清晰的主线，而是按照 API 组织章节的，内容在逻辑上比较零散。
• 大多是“讲是什么，怎么用“，而不是”讲为什么，讲原理“。
• 大多数内容比较枯燥，趣味性比较低。都是干巴巴的文字，没有图片，缺乏能够引起强烈共鸣的例子。

因此我的想法是做一套不同市面上大多数的 TypeScript 学习教程。以人类认知的角度思考问题，学习 TypeScript，通过通俗易懂的例子和图片来帮助大家建立 TypeScript 世界观。

系列安排：

• 上帝视角看 TypeScript（已发布）
• TypeScript 类型系统（就是本文）
• types 和 @types 是什么？
• 你不知道的 TypeScript 泛型（万字长文，建议收藏）（已发布）
• TypeScript 配置文件该怎么写？
• TypeScript 是如何与 React，Vue，Webpack 集成的？
• TypeScript 练习题

目录将来可能会有所调整。

注意，我的系列文章基本不会讲 API，因此需要你有一定的 TypeScript 使用基础，推荐两个学习资料。

• 深入理解 TypeScript
• 官方文档

结合这两个资料和我的系列教程，掌握 TypeScript 指日可待。

接下来，我们通过几个方面来从宏观的角度来看一下 TypeScript。

TypeScript 的学习资料非常多，其中也不乏很多优秀的文章和教程。但是目前为止没有一个我特别满意的。原因有：

• 它们大多数没有一个清晰的主线，而是按照 API 组织章节的，内容在逻辑上比较零散。
• 大多是“讲是什么，怎么用“，而不是”讲为什么，讲原理“。
• 大多数内容比较枯燥，趣味性比较低。都是干巴巴的文字，没有图片，缺乏能够引起强烈共鸣的例子。

因此我的想法是做一套不同市面上大多数的 TypeScript 学习教程。以人类认知的角度思考问题，学习 TypeScript，通过通俗易懂的例子和图片来帮助大家建立 TypeScript 世界观。 而本篇文章则是这个系列的开篇。

系列安排：

• 上帝视角看 TypeScript（就是本文）
• TypeScript 类型系统
• 什么是 types？什么是 @types？
• 类型推导， 类型断言与类型保护
• 你不知道的 TypeScript 泛型（万字长文，建议收藏）（已发布）
• TypeScript 练习题
• TypeScript 配置文件该怎么写？
• TypeScript 是如何与 React，Vue，Webpack 集成的？

目录将来可能会有所调整。

注意，我的系列文章基本不会讲 API，因此需要你有一定的 TypeScript 使用基础，推荐两个学习资料。

• 深入理解 TypeScript
• 官方文档

结合这两个资料和我的系列教程，掌握 TypeScript 指日可待。

接下来，我们通过几个方面来从宏观的角度来看一下 TypeScript。

泛型是 TypeScript（以下简称 TS） 比较高级的功能之一，理解起来也比较困难。泛型应用场景非常广泛，很多地方都能看到它的影子。平时我们阅读开源 TS 项目源码，或者在自己的 TS 项目中使用一些第三方库（比如 React）的时候，经常会看到各种泛型定义。如果你不是特别了解泛型，那么你很可能不仅不会用，不会实现，甚至看不懂这是在干什么。

相信大家都经历过，看到过，或者正在写一些应用，这些应用充斥着各种重复类型定义， any 类型层出不穷，鼠标移到变量上面的提示只有 any，不要说类型操作了，类型能写对都是个问题。我也经历过这样的阶段，那个时候我对 TS 还比较陌生。

随着在 TS 方面学习的深入，越来越认识到 真正的 TS 高手都是在玩类型，对类型进行各种运算生成新的类型。这也好理解，毕竟 TS 提供的其实就是类型系统。你去看那些 TS 高手的代码，会各种花式使用泛型。 可以说泛型是一道坎，只有真正掌握它，你才知道原来 TS 还可以这么玩。怪不得面试的时候大家都愿意问泛型，尽管面试官很可能也不怎么懂。

只有理解事物的内在逻辑，才算真正掌握了，不然永远只是皮毛，不得其法。 本文就带你走进泛型，带你从另一个角度看看究竟什么是泛型，为什么要有它，它给 TS 带来了什么样的不同。

注意：不同语言泛型略有不同，知识迁移虽然可以，但是不能生搬硬套，本文所讲的泛型都指的是 TS 下的泛型。