最近在学习TypeScript，走了不少弯路，今天来分享我的进阶学习路线，希望能帮到大家。

最近，我，在，学习，TypeScript，作为，一个，写，了，多年，JavaScript，的，前端，开发者，刚开始，接触，TypeScript，的，时候，确实，有，一些，不，适应，觉得，类型，系统，很，麻烦，写，代码，的，时候，要，考虑，类型，很，不，自由，但是，用，了，一段时间，之后，我，发现，TypeScript，确实，能，帮，我们，写出，更，健壮，更，可维护，的，代码，尤其是，在，大型，项目，中，TypeScript，的，优势，非常，明显。

我，自己，在，学习，TypeScript，的，过程，中，走，了，不少，弯路，也，总结，了，一些，经验，今天，这篇，文章，就，来，分享，我，的，TypeScript，进阶，学习，路线，以及，我，是，怎么，入门，的。

一、为什么要学TypeScript

在，说，学习，路线，之前，先，说说，为什么，要，学，TypeScript，很多，人，可能，会，问，JavaScript，用，得，好好，的，为什么，要，学，TypeScript，呢，它，有，什么，好处，呢。

我，自己，的，感受，是，TypeScript，最大，的，好处，就是，类型，安全，能，在，编译，阶段，就，发现，很多，错误，而，不是，等到，运行，的时候，才，发现，比如，你，调用，一个，函数，传，错，了，参数，类型，或者，访问，了，一个，不，存在，的，属性，TypeScript，在，编译，的，时候，就，会，报错，提醒，你，而，JavaScript，可能，要，等到，运行，的时候，才，会，报错，甚至，不，报错，只是，返回，undefined，导致，bug，很难，排查。

而且，TypeScript，的，类型，提示，非常，好用，在，IDE，里，写，代码，的，时候，能，自动，补全，属性，和，方法，还，能，显示，类型，信息，写，代码，的，效率，提高，很多，也，不，容易，写错，尤其是，在，大型，项目，中，代码，量，大，模块，多，有，了，类型，提示，能，帮，你，快速，理解，代码，不，用，到处，翻，定义，很，方便。

还有，TypeScript，支持，最新，的，JavaScript，特性，甚至，一些，还，在，提案，阶段，的，特性，你，可以，提前，用，然后，编译，成，兼容，的，JavaScript，代码，不用，等，浏览器，支持，很，方便，而且，TypeScript，是，JavaScript，的，超集，也就是说，所有，合法，的，JavaScript，代码，都，是，合法，的，TypeScript，代码，你，可以，渐进式，地，迁移，不，用，一下子，把，所有，代码，都，改成，TypeScript，可以，一个，文件，一个，文件，地，改，很，灵活。

现在，很多，大，公司，和，知名，项目，都，在，用，TypeScript，比如，Angular，Vue 3，React，也，有，很好，的，TypeScript，支持，还有，VS Code，本身，就是，用，TypeScript，写，的，所以，学，TypeScript，是，趋势，对，职业，发展，也，很，有，好处，这，也是，我，决定，认真，学，TypeScript，的，原因。

二、入门阶段：基础语法和类型

我，学，TypeScript，的，第一，阶段，是，入门，阶段，主要，学，基础，语法，和，类型，系统，这，个，阶段，是，基础，一定要，打，扎实，不然后面，学，起来，会，很，吃力。

首先，我，是，从，官方，文档，开始，学，的，TypeScript，的，官方，文档，写，得，很，好，很，详细，也，很，易懂，是，最好，的，学习，资料，我，建议，大家，入门，的，时候，一定，要，认真，看，官方，文档，不要，只，看，一些，二手，的，教程，因为，二手，教程，可能，有，错误，或者，过时，官方，文档，是，最，权威，的。

入门，阶段，主要，要，掌握，以下，内容：

1. 基础类型

TypeScript，支持，很多，基础，类型，比如，number，string，boolean，array，tuple，enum，any，void，null，undefined，never，object，等等，这些，基础，类型，一定要，掌握，知道，每个，类型，怎么，用，什么，时候，用，什么，类型。

比如，number，是，数字，类型，包括，整数，和，浮点数，string，是，字符串，类型，boolean，是，布尔，类型，array，是，数组，类型，可以，用，number[]，或者，Array<number>，的，写法，tuple，是，元组，类型，是，固定，长度，和，类型，的，数组，enum，是，枚举，类型，用来，定义，一组，命名，的，常量，any，是，任意，类型，不，建议，多用，因为，用，any，就，失去，了，类型，检查，的，意义，void，是，没有，返回值，的，函数，的，返回，类型，null，和，undefined，是，对应的，类型，never，是，永远，不，会，有，返回值，的，函数，的，返回，类型，比如，抛出，异常，的，函数，object，是，对象，类型。

这些，基础，类型，看起来，多，但是，其实，都，很，简单，用，几次，就，熟悉，了，关键是，要，理解，每个，类型，的，含义，和，用法，不要，死记硬背。

2. 接口interface

接口，是，TypeScript，中，非常，重要，的，一个，概念，用来，定义，对象，的，形状，也就是，对象，应该，有，哪些，属性，每个，属性，是什么，类型，接口，能，让，你，的，代码，更，清晰，也，能，提供，更好，的，类型，检查，和，提示。

比如，你，可以，定义，一个，User，接口，有，name，属性，是，string，类型，age，属性，是，number，类型，然后，你，定义，一个，对象，的，类型，是，User，那么，这个，对象，就，必须，有，name，和，age，属性，而且，类型，要，对，不然，就，会，报错，这样，就，能，保证，对象，的，形状，是，正确，的。

接口，还，支持，可选，属性，只读，属性，索引，签名，函数，类型，等等，这些，都，要，掌握，接口，是，TypeScript，中，用，得，最，多，的，特性，之一，一定要，学好。

3. 类型断言

类型，断言，就是，你，告诉，TypeScript，你，比，它，更，了解，某个，值，的，类型，让，它，不要，检查，了，直接，按，你，说，的，类型，来，类型，断言，有，两种，写法，一种，是，尖括号，写法，<string>value，一种，是，as，写法，value as string，在，JSX，中，只能，用，as，写法，所以，建议，大家，都，用，as，写法，更，统一。

类型，断言，要，慎用，因为，它，相当于，绕过，了，类型，检查，如果，你，断言，错，了，可能，会，导致，运行时，错误，所以，只有，在，你，确实，确定，类型，的，时候，才，用，类型，断言，不要，滥用。

4. 类型推断

TypeScript，有，类型，推断，的，功能，很多，时候，你，不用，显式，地，写，类型，TypeScript，会，根据，上下文，自动，推断，出，类型，比如，你，定义，一个，变量，let a = 1，TypeScript，会，自动，推断，a，的，类型，是，number，你，不用，显式，写，let a: number = 1，当然，显式，写，也，可以，但是，很多，时候，类型，推断，已经，足够，了，不用，每个，地方，都，写，类型，这样，代码，更，简洁。

但是，要，注意，有些，情况，TypeScript，推断，不，出来，或者，推断，的，类型，不，是，你，想要，的，这，时候，就，需要，显式，写，类型，了，比如，函数，的，参数，类型，一般，建议，显式，写，因为，TypeScript，不一定，能，推断，出，参数，类型，而且，显式，写，参数，类型，也，能，让，函数，的，接口，更，清晰。

入门，阶段，主要，就是，这些，内容，看起来，多，但是，其实，都，很，基础，用，几天，时间，就能，掌握，关键是，要，多，写，代码，多，练习，不要，只，看，不，练，我，当时，是，边，看，文档，边，写，一些，小，例子，练习，很快，就，入门，了。

三、进阶阶段：高级类型和泛型

入门，之后，就，进入，进阶，阶段，了，这，个，阶段，主要，学，高级，类型，和，泛型，这，是，TypeScript，的，难点，也是，重点，掌握，了，这些，你，的，TypeScript，水平，就，能，上，一个，台阶。

1. 联合类型和交叉类型

联合，类型，就是，一个，值，可以，是，多种，类型，中，的，一种，用，|，符号，连接，比如，string | number，就是，这个，值，可以，是，string，也，可以，是，number，联合，类型，很，常用，比如，函数，的，参数，可以，接受，多种，类型，的，值，就，可以，用，联合，类型。

交叉，类型，就是，把，多个，类型，合并，成，一个，类型，用，&，符号，连接，比如，A & B，就是，这个，类型，同时，有，A，和，B，的，所有，属性，交叉，类型，常用，在，对象，的，合并，比如，把，两个，接口，合并，成，一个。

联合，类型，和，交叉，类型，是，TypeScript，中，很，重要，的，高级，类型，一定要，掌握，而且，要，理解，它们，的，区别，和，用法，不要，搞混，了。

2. 类型守卫

类型，守卫，就是，在，运行时，检查，一个，值，的，类型，然后，在，某个，分支，中，缩小，这个，值，的，类型，这样，你，就，能，在，这个，分支，中，安全地，访问，这个，类型，的，属性，和，方法，类型，守卫，是，处理，联合，类型，的，重要，手段。

常见，的，类型，守卫，有，typeof，instanceof，in，还有，自定义，类型，守卫，比如，typeof，能，判断，基础，类型，比如，typeof value === 'string'，就能，在，这个，分支，中，把，value，的，类型，缩小，为，string，instanceof，能，判断，类，的，实例，比如，value instanceof Date，就能，把，value，的，类型，缩小，为，Date，in，能，判断，对象，是否，有，某个，属性，比如，'name' in value，就能，判断，value，是否，有，name，属性。

自定义，类型，守卫，就是，你，自己，写，一个，函数，返回，一个，类型，谓词，比如，function isString(value: any): value is string，这样，你，调用，这个，函数，之后，在，if，分支，中，value，的，类型，就，会，被，缩小，为，string，自定义，类型，守卫，很，灵活，能，处理，复杂，的，类型，判断。

类型，守卫，是，TypeScript，中，很，重要，的，概念，一定要，掌握，它，能，让，你，在，处理，联合，类型，的，时候，更，安全，更，方便。

3. 泛型

泛型，是，TypeScript，中，最，重要，也，是，最，难，的，特性，之一，泛型，就是，你，写，代码，的，时候，不，指定，具体，的，类型，而是，用，一个，类型，参数，代替，等到，使用，的，时候，再，指定，具体，的，类型，这样，你，的，代码，就，能，复用，支持，多种，类型，同时，又，有，类型，安全。

比如，你，写，一个，函数，identity，返回，传入，的，参数，如果你，用，any，类型，就，失去，了，类型，检查，但是，用，泛型，function identity<T>(value: T): T，就，能，保留，类型，信息，你，传入，string，返回，就是，string，传入，number，返回，就是，number，很，安全，也，很，灵活。

泛型，不仅，能用，在，函数，上，还，能用，在，接口，类，类型，别名，上，比如，泛型，接口，interface Box<T> { value: T }，泛型，类，class Box<T> { value: T }，等等，泛型，是，TypeScript，中，非常，强大，的，特性，很多，高级，的，类型，操作，都，需要，用，泛型，来，实现。

泛型，还有，一些，高级，用法，比如，泛型，约束，条件，类型，映射，类型，推断，类型，等等，这些，是，更，高级，的，内容，后面，会，说到，入门，阶段，先，掌握，基础，的，泛型，用法，就，可以，了。

4. 类型别名

类型，别名，就是，给，一个，类型，起，一个，名字，用，type，关键字，比如，type ID = string | number，这样，你，就，能，用，ID，来，代替，string | number，代码，更，简洁，也，更，清晰，类型，别名，和，接口，有点，像，都，能，定义，对象，类型，但是，也，有，区别，类型，别名，更，灵活，能，定义，联合，类型，交叉，类型，元组，等等，接口，更，适合，定义，对象，的，形状，而且，接口，能，被，继承，和，实现，类型，别名，不行，所以，一般，定义，对象，类型，用，接口，定义，其他，类型，用，类型，别名。

进阶，阶段，主要，就是，这些，内容，这，个，阶段，是，难点，需要，花，一些，时间，去，理解，和，练习，我，当时，学，泛型，的，时候，也，觉得，很，抽象，不，好，理解，但是，多，写，一些，例子，多，用，几次，慢慢，就，理解，了，关键是，不要，怕，要，多，练。

四、高级阶段：高级类型和类型体操

掌握，了，进阶，内容，之后，就，可以，进入，高级，阶段，了，这，个，阶段，主要，学，高级，类型，和，所谓，的，类型，体操，这，是，TypeScript，最，难，也，最，有趣，的，部分，掌握，了，这些，你，就，能，写出，非常，灵活，非常，强大，的，类型，定义。

1. 条件类型

条件，类型，就是，根据，条件，判断，来，选择，不同，的，类型，语法，类似，三元，运算符，T extends U ? X : Y，意思，是，如果，T，是，U，的，子类型，就，返回，X，否则，返回，Y，条件，类型，非常，强大，能，实现，很多，复杂，的，类型，操作。

比如，TypeScript，内置，的，很多，工具，类型，都是，用，条件，类型，实现，的，比如，Exclude<T, U>，用来，从，T，中，排除，U，的，类型，Extract<T, U>，用来，从，T，中，提取，U，的，类型，NonNullable<T>，用来，排除，null，和，undefined，ReturnType<T>，用来，获取，函数，的，返回，类型，InstanceType<T>，用来，获取，类，的，实例，类型，等等，这些，工具，类型，都，很，常用，一定要，掌握，而且，最好，能，理解，它们，的，实现，原理，这样，你，自己，也，能，写，类似，的，工具，类型。

2. 映射类型

映射，类型，就是，基于，已有，的，类型，创建，新，的，类型，通过，遍历，已有，类型，的，属性，来，创建，新，类型，语法，是，{ [P in K]: T }，比如，Readonly<T>，就是，把，T，的，所有，属性，都，变成，只读，Partial<T>，就是，把，T，的，所有，属性，都，变成，可选，Required<T>，就是，把，T，的，所有，属性，都，变成，必选，Pick<T, K>，就是，从，T，中，选取，K，中的，属性，Omit<T, K>，就是，从，T，中，排除，K，中的，属性，等等，这些，也，都是，常用，的，工具，类型，要，掌握。

映射，类型，还，能，和，条件，类型，结合，实现，更，复杂，的，类型，操作，比如，根据，属性，的，类型，来，过滤，属性，等等，很，强大。

3. infer关键字

infer，关键字，是，TypeScript，中，很，重要，的，一个，关键字，用来，在，条件，类型，中，推断，类型，比如，你，想，获取，函数，的，返回，类型，就，可以，用，infer，type ReturnType<T> = T extends (...args: any[]) => infer R ? R : any，这里，infer R，就是，推断，函数，的，返回，类型，赋值，给，R，然后，返回，R，infer，非常，强大，能，实现，很多，复杂，的，类型，推断，是，类型，体操，的，重要，工具，一定要，掌握。

4. 模板字面量类型

模板，字面量，类型，是，TypeScript 4.1，引入，的，新，特性，能，让，你，用，模板，字符串，的，语法，来，创建，类型，比如，type Hello = Hello ${string}，这样，Hello，就是，所有，以，Hello，开头，的，字符串，类型，模板，字面量，类型，非常，强大，能，实现，很多，之前，实现，不了，的，类型，操作，比如，字符串，的，拼接，转换，等等，是，很，新，也，很，有用，的，特性，不过，这个，是，2020年，底，才，出，的，2019年，的，时候，还，没有，所以，我，当时，学，的，时候，还，没有，这个，特性，是，后来，才，学，的，这里，提，一下，大家，知道，就，好。

高级，阶段，的，内容，比较，难，也，比较，多，需要，花，很多，时间，去，研究，和，练习，我，自己，也，还，在，学习，中，很多，高级，的，类型，体操，也，不，是，很，熟练，但是，我，觉得，不用，太，焦虑，这些，高级，内容，在，日常，开发，中，用，得，不，是，很多，大部分，时候，用，基础，和，进阶，的，内容，就，够，了，高级，内容，是，锦上添花，有，时间，可以，学，没，时间，可以，先，放，一放，等，需要，的，时候，再，学。

五、实战阶段：在项目中使用

学，了，理论，之后，一定要，在，实战，中，使用，不然，很，容易，忘，而且，只有，在，实战，中，你，才能，真正，理解，TypeScript，的，用法，和，好处，我，学，TypeScript，的，时候，就是，边，学，边，在，项目，中，用，进步，很，快。

首先，你，可以，找，一个，小，项目，用，TypeScript，来，写，比如，一个，小，工具，一个，小，网站，等等，这样，你，能，在，实战，中，练习，TypeScript，的，各种，特性，而且，项目，小，不，会，有，太大，压力，容易，坚持，下来。

然后，你，可以，尝试，把，你，现有，的，JavaScript，项目，迁移，成，TypeScript，TypeScript，支持，渐进式，迁移，你，可以，一个，文件，一个，文件，地，改，先，把，文件，后缀，从，.js，改成，.ts，然后，慢慢，加，类型，这样，压力，不，大，也，能，在，实战，中，学习，迁移，的，过程，中，你，会，遇到，很多，问题，比如，第三方，库，没有，类型，定义，怎么办，类型，报错，怎么，解决，等等，这些，问题，都，能，帮，你，更，好，地，理解，TypeScript。

还有，要，学会，用，@types，类型，定义，很多，第三方，库，本身，没有，类型，定义，但是，社区，有，@types，包，提供，类型，定义，比如，@types/node，@types/react，@types/lodash，等等，你，只，需要，安装，对应，的，@types，包，就，能，有，类型，提示，了，很，方便，如果，某个，库，没有，@types，包，你，也，可以，自己，写，类型，声明，文件，.d.ts，来，声明，类型，这样，也，能，有，类型，提示。

还有，要，学会，配置，tsconfig.json，tsconfig.json，是，TypeScript，的，配置，文件，能，配置，编译，选项，比如，目标，版本，模块，系统，严格，模式，等等，合理，的，配置，能，让，TypeScript，更好，地，工作，也，能，帮，你，写出，更，规范，的，代码，建议，大家，开启，严格，模式，"strict": true，这样，TypeScript，会，做，更，严格，的，类型，检查，能，帮，你，发现，更多，问题，虽然，刚开始，可能，会，觉得，很，麻烦，很多，报错，但是，习惯，了，之后，你，会，发现，严格，模式，确实，能，帮，你，写出，更，健壮，的，代码。

实战，阶段，是，最，重要，的，阶段，只有，在，实战，中，你，才能，真正，掌握，TypeScript，所以，一定，要，多，写，代码，多，在，项目，中，用，不要，只，看，不，练。

六、学习资源推荐

最后，推荐，一些，我，觉得，好，的，学习，资源，给，大家。

1. 官方文档

TypeScript，的，官方，文档，是，最好，的，学习，资料，写，得，很，详细，也，很，易懂，而且，是，最，权威，的，不会，有，错误，或者，过时，的，问题，建议，大家，入门，的，时候，一定，要，认真，看，官方，文档，地址，是，www.typescriptlang.org/docs。

2. TypeScript Handbook

TypeScript Handbook，是，官方，的，手册，比，文档，更，系统，更，深入，适合，进阶，学习，里面，讲，了，很多，高级，的，特性，和，用法，很，值得，一看，地址，也，在，官方，网站，上。

3. 深入理解TypeScript

这，是，一本，免费，的，在线，书籍，作者，是，Basarat Ali Syed，写，得，非常，好，很，深入，覆盖，了，TypeScript，的，方方面面，从，基础，到，高级，都，有，而且，有，很多，例子，很，适合，系统，学习，地址，是，basarat.gitbook.io/typescript。

4. 实战项目

最好，的，学习，方式，就是，实战，找，一些，开源，的，TypeScript，项目，看，看，别人，是，怎么，写，的，比如，VS Code，Angular，Vue 3，等等，都是，用，TypeScript，写，的，看，优秀，的，代码，能，帮，你，提高，很，快。

七、写在最后

TypeScript，是，一个，非常，优秀，的，语言，能，帮，我们，写出，更，健壮，更，可维护，的，代码，虽然，刚开始，学，的，时候，可能，会，觉得，有，一些，不，适应，觉得，类型，系统，很，麻烦，但是，只要，坚持，学，下去，多，在，实战，中，用，你，一定，会，发现，TypeScript，的，好处，也，会，喜欢，上，它。

我，自己，学，TypeScript，的，过程，也，不是，一帆风顺，的，走，了，不少，弯路，也，遇到，了，很多，问题，但是，通过，不断，地，学习，和，练习，慢慢，就，掌握，了，现在，写，项目，基本，都，用，TypeScript，已经，离不开，它，了，所以，大家，不要，怕，难，只要，坚持，就，一定，能，学会。

希望，这篇，文章，能，给，正在，学习，TypeScript，的，朋友，一些，参考，也，欢迎，大家，在，评论，区，分享，你们，学习，TypeScript，的，经验，和，心得，或者，有，什么，问题，也，可以，在，评论，区，问，我，一起，交流，一起，进步。

愿，我们，都，能，在，技术，的，道路，上，不断，学习，不断，进步，写出，更，优秀，的，代码。