理想必须要人们去实现它,它不但需要决心和勇敢
(一) Typescript 究竟是什么
Typescript 简单来说就是 Javascript 的一个超集。它解决了 Javascript 无法解决的一些痛点
访问了一个对象没有的属性
调用了一个函数却少传了参数
函数的返回值是一个字符串你却把它当作数值用了
等等 以上这些问题我都能解决
而 Typescript 和 Javascript 不同的是 他可以在你编写代码的时候,就对一些错误进行提示.还能在你使用某个数据的时候为你列出这个数据可以访问的属性和方法
当我们的项目较为庞大,需要由多人合作开发的时候,多人协作是需要沟通的成本和 review 成本的。一些接口的定义,一些方法的使用,都可能因为个人习惯不同导致逻辑差异
而如果引入 Typescript 则会对一些实行强校验,如果不按照接口实现,编译则没法通过.
哪些项目适合用 Typescript 开发呢,我总结了以下几类:
需要多人合作开发的项目
开源项目,尤其是工具函数或者组件库或者组件库
对代码质量有很高要求的项目
(二) Typescript 应该怎么学
学会看文档
这个文档只是对英文文档的翻译,官方文档中的一些小疏漏,这个文档也没有做校验.而且更新还有些滞后.所以最好还是看英文文档
学会看报错
- 例如类型错误
当我们配置书写的代码不符合规范的时候,error 就会报错 例如下图
上面这个报错从红色方框中看到标识了 TS 说明它是 Typescript 编译器报的错误,在我们书写代码的时候 通过强类型系统,编辑器可以在这个阶段检测我们的一些错误
很明显这个错误是因为我们给 name 指定了类型为 string 字符串类型,而赋值给他却是 123 数值类型
- 例如定义没有定义的变量
当我们在代码中打印一个没有定义的变量的时候。浏览器就是报错。看到错误提示
红色语句即错误信息。下面红色 at 后面有个文件路径 main.ts ，蓝色框中圈出的也是个文件路径。表示这个错误出现在哪个文件。这里是出现在 main.ts 中后面的 cd49:12 表示在 12 行,点击即可跳转
学会看声明文件
一些 JS 库的作者已经使用 TypeScript 进行了重写，有些则是提供了声明文件，一些作者没有提供声明文件的，大部分库都有社区的人为他们补充了声明文件，如果使用了自身没有提供声明文件的库时，可以使用 npm install @types/{模块名}来安装
安装好 TypeScript 后，我们可以在 node_modules 文件夹下找到 typescript 文件夹，里面有个 lib 文件夹，lib 文件夹根目录下有很多以 lib. 开头的 .d.ts 文件。这些文件，就是我们在开发时如果需要用到相关内容，需要在 tsconfig.json 文件里配置引入的库的声明文件，这个配置我们后面会讲到。先简单举个例子，比如我们要使用 DOM 操作相关的语法，比如我们获取了一个 button 按钮的节点，那么我们就可以指定它的类型为 HTMLButtonElement，那么我们再访问这个节点的属性的时候，编辑器就会给你列出 button 节点拥有的所有属性方法了；如果我们要用到这个类型接口，那我们就需要引入 lib.dom.d.ts 也就是 dom 这个 lib。这里如果你对一些提到的概念不明白，你可以先忽略.
(三) Typescript 安装配置和搭建开发环境
Typescript 需要 Node 的安装环境,请自行安装
安装包依赖
npm install -g typescript
npm install -g ts-node
- 编写 Typescript 文件
console.log('Hello Typescript!')- 打开控制台输入
ts-node 文件名.ts //结果就是 Hello Typescript!
