共计 3578 个字符，预计需要花费 9 分钟才能阅读完成。
本文首发自「慕课网」，想理解更多 IT 干货内容，程序员圈内热闻，欢送关注！
作者 | 慕课网精英讲师 Lison
这篇文章我会教给大家如何去自学 TypeScript，哪怕 TypeScript 更新了，你也能毫无压力地迎接它的新个性。好，接下来让咱们开始吧。1.2.1 学会看文档英文官网文档始终是及时更新的。但即使是官网的文档，有一些更新在更新日志里写了，而老手指南里却没有及时同步更新，所以有时看指南也会遇到困惑，就是文档里写的和你理论验证的成果不一样。遇到这种问题，首先确定你应用的 TypeScript 版本，而后去更新日志里依据不同版本找对这部分常识的更新记录。如果找到了，看下这是在哪个版本做的降级；如果你不释怀，能够把 TypeScript 版本降到这个版本之前的一个版本，再验证一下。TypeScript 是有一个中文文档的，然而这个文档只是对英文文档的翻译。官网文档中的小疏漏，这个文档也没有做校验，而且更新是有点滞后的。在写这篇文章的时候，TypeScript 最新公布的版本为 3.4，然而中文文档还是在 3.1。所以想理解 TypeScript 的最新动静，还是要看英文官网文档的。不过咱们还是要感激提供中文文档的译者，这对于英文不是很好的开发者帮忙还是很大的。
1.2.2 学会看报错我的项目搭建的时候，要应用 TSLint 对代码格调进行标准校验，依据 TSLint 配置不同，提醒成果也不同。如果咱们配置当书写的代码不符合规范，应用 error 级别来提醒时，会和 TypeScript 编译报错一样，在问题代码上面用红色波浪线标出，鼠标放上去会有谬误提醒。所有如果咱们应用了 TSLint，遇到报错的时候，首先要辨别是 TSLint 报错还是 TS 报错，来看下如何辨别：
下面这个报错能够从红色方框中看到，标识了 tslint，阐明它是 TSLint 的报错。前面括号里标的是导致这条报错的规定名，规定能够在 tslint.json 文件里配置。对于 TSLint 的应用，咱们会在搭建开发环境一节解说。示例中这条报错是因为 no-console 这个规定，也就是要求代码中不能有 console 语句，然而咱们在开发时应用 console 来进行调试是很常见的，所以你能够通过配置 TSLint 敞开这条规定，这样就不会报错了。但咱们应该恪守标准，当咱们决定引入 TSLint 的时候，就阐明这个我的项目对代码品质有更高的要求，咱们不应该在书写代码遇到 TSLint 报错就批改规定，而是应该依据规定去批改代码。
下面这个报错能够从红色方框中看到，标识了 ts，阐明它是 TypeScript 编译器报的谬误。在咱们书写代码的时候，通过强类型零碎，编译器能够在这个阶段就检测到咱们的一些谬误。前面括号里跟着的 2322 是错误代码，所有的错误代码你能够在文档的错误信息列表中查看。不过你个别并不需要去看文档，因为这里都会给你标出这个错误码对应的谬误提醒，而且这个错误信息依据你的编辑器语言能够提醒中文错误信息。很显著这个谬误是因为咱们给 name 指定了类型为 string 字符串 类型，而赋给它的值是 123 数值类型。下面两种是在编写代码的时候就会遇到的谬误提醒。还有一种就是和 JavaScript 一样的，在运行时的报错，这种谬误须要在浏览器控制台查看。如果你调试的是 node 服务端我的项目，那你要在终端查看。来看这个例子：当我在代码中打印一个没有定义的变量时，在书写代码的时候会做提醒，且当程序运行起来时，在浏览器控制台也能够看到报错。你能够关上浏览器的开发者工具 (Windows 零碎按 F12，Mac 零碎按 control+option+i)，在 Console 栏看到谬误提醒：
红色语句即错误信息。上面红色 at 前面有个文件门路 main.ts，蓝色框中圈出的也是个文件门路，示意这个谬误呈现在哪个文件。这里是呈现在 main.ts 中，问号前面的 cd49:12 示意错误代码在 12 行，点击这个门路即可跳到一个该文件的浏览窗口：
在这里咱们就能间接看到咱们的错误代码被红色波浪线标记了，这样你批改起谬误来就很明确晓得是哪里出错了。1.2.3 学会看申明文件申明文件咱们会在前面讲。咱们晓得原来没有 TypeScript 的时候，有很多的 JS 插件和 JS 库，如果应用 TypeScript 进行开发再应用这些 JS 编写的插件和库，就得不到类型提醒等个性的反对了，所以 TypeScript 反对为 JS 库增加申明文件，以此来提供申明信息。咱们应用 TypeScript 编写的库和插件编译后也是 JS 文件，所以在编译的时候能够抉择生成申明文件，这样再公布，使用者就仍然能失去 TypeScript 个性反对。一些 JS 库的作者曾经应用 TypeScript 进行了重写，有些则是提供了申明文件，一些作者没有提供申明文件的，大部分库都有社区的人为他们补充了申明文件，如果应用了本身没有提供申明文件的库时，能够应用 npm install @types/{模块名} 来装置，或者使用咱们前面讲到的常识自行为他们补充。看这些库的申明文件可能帮你进步对 TypeScript 的理解水平。因为可能你在理论开发中所接触的场景不是很简单，使用到的 TypeScript 语法点也不是很全面，所以就会导致常常用的你很相熟，不常常用的缓缓就忘掉了，甚至有的从头至尾你都没有应用过。很多常识你只看理论知识，或者看简略的例子，是没法真正了解并粗浅记忆的，只有在理论场景中去应用一下，能力加深了解。所以咱们能够从这些库的申明文件动手，还有就是从 TypeScript 内置的 lib 申明文件动手。
装置好 TypeScript 后，咱们能够在 node_modules 文件夹下找到 typescript 文件夹，外面有个 lib 文件夹，lib 文件夹根目录下有很多以 lib. 结尾的 .d.ts 文件。这些文件，就是咱们在开发时如果须要用到相干内容，须要在 tsconfig.json 文件里配置引入的库的申明文件，这个配置咱们前面会讲到。先简略举个例子，比方咱们要应用 DOM 操作相干的语法，比方咱们获取了一个 button 按钮的节点，那么咱们就能够指定它的类型为 HTMLButtonElement，那么咱们再拜访这个节点的属性的时候，编辑器就会给你列出 button 节点领有的所有属性办法了；如果咱们要用到这个类型接口，那咱们就须要引入 lib.dom.d.ts 也就是 dom 这个 lib。这里如果你对一些提到的概念不明确，你能够先疏忽，因为前面都会讲到。这里我要通知你的就是，你应该学着看这些申明文件，看看它们对于一些内容的申明是如何定义的，可能帮你见识到各种语法的使用。1.2.4 学会搜问题和发问理论开发中，有时候你难免会遇到一些文档里没有提到的各种各样的奇怪问题。解决问题的路径有很多，求教有教训的人是最简略的啦，但前提是你身边有个随叫随到的大神，可这样的人个别很少有，所以还是看看我举荐给你的解决问题的路径吧：路径 1：百度 or Google 一般来说公众的问题都能在百度找到，然而开发问题 Google 可能帮你找到一些高质量的国外答疑帖，所以这两个搜索引擎你都能够试试，这个路径是你遇到问题之后的首选。路径 2：看 issueTypeScript 的问答的确要比很多框架或者基础知识的少很多。如果搜索引擎找不到，你能够到 github 上 TypeScript 的官网仓库，在 issues 里能够通过问题关键字搜寻，看看有没有人反馈过这个问题。这里要留神，搜寻的是关键字，而不是把你的报错信息残缺输进去，这样根本很难搜到。你应该挑选出错误信息中比拟具备代表性的单词进行搜寻，因为这和搜索引擎不一样，issues 提供的搜寻还不是很弱小。路径 3：去发问如果下面两个路径都没找到，你只能自行发问了，这也是一个造福前人的办法。比拟受欢迎的发问网站：国内你能够试试 segmentFault，国外能够试试 stackOverflow，还有就是 TypeScript 的 issues 了。但要留神如果在 stackOverflow 和 issues 中发问，最好最好用英文。1.2.5 看优良我的项目源码这个学习办法是比拟高阶的了，看一些优良的开源我的项目源码能够为你提供思路。你还能够借鉴到同一个逻辑不同人的实现形式。源码去哪里找呢，当然首选是 Github 了，进入 Github 后，你能够在顶部的搜寻栏搜寻你想要找的我的项目关键字，比方你想找个 Todo 利用的我的项目源码，那就搜 ”todo”。而后在语言栏抉择 TypeScript，这样就会筛选出应用 TypeScript 编写的我的项目：
最初抉择 star 较多的我的项目，阐明这个我的项目受到了更多人的认可：
好了，以上就是自学 TypeScript 的一些办法路径。欢送关注「慕课网」，发现更多 IT 圈优质内容，分享干货常识，帮忙你成为更好的程序员！
