Xavi的技术文档

切换主题

TypeScript 简介 ​

TypeScript（简称 TS）是微软公司开发的基于 JavaScript 语言的编程语言，目的是增强 JavaScript 的功能，使其更适合复杂的大型项目。

TS 可以看作是 JS 的超集，在继承了 JS 全部功能的基础上增加了一个独立的类型系统和自己的语法。

类型的概念 ​

类型指具有相同特征的值，一旦确定了值的类型，就可以确定这个值具有该类型的所有特征，可以进行该类型的所有运算。

可以理解为类型是认为添加的编程约束和用法提示，主要在开发过程中巍峨编译器和开发工具提供更多的验证和帮助。帮助提高代码质量，减少错误。

动态类型和静态类型 ​

在语法上，JS 属于动态类型语言。

js
let x = 1;
x = "hello";

上面的例子中，x 声明为数字，但赋值时修改为字符串，且不会报错。

所以无法提前知道变量的类型是什么，也就是说变量的类型是动态的。这些动态变化不具有很强的约束性，对于提前发现代码错误非常不利。

TS 引入了更强大、更严格的类型系统，属于静态类型语言。同样的代码在 TS 中会报错：

ts
let x = 1;
x = "hello"; // Type 'string' is not assignable to type 'number'

静态类型的优点 ​

  1. 有利于代码的静态分析

静态类型不必运行代码，就可以确定变量的类型，从而推断代码又没有错误，这叫做代码的静态分析。

这对于复杂项目非常重要，在开发阶段就可以规避很多问题，大大降低线上风险。

  1. 有利于发现错误

由于每个值都有严格的类型约束，TS 可以轻松发现拼写错误、语义错误、方法调用错误等。

  1. 更好的编辑器支持

TS 提供的代码检查，可以获取到所用的值或相关属性的类型，可以实现语法补全、错误提示的功能，以及部分语法错误代码的自动修复和易识别代码的自动重构（例如变量重命名）等。

  1. 提供了代码文档

类型信息可以部分替代代码文档，熟悉的开发者往往能够只看类型就推断出代码的作用。借助类型信息，也可以使用工具直接生成文档。

  1. 有助于代码重构

类型信息大大减轻了重构的成本。一般来说，只要函数或对象的参数和返回值保持类型不变，就能基本确定，重构后的代码也能正常运行。如果还有配套的单元测试，就完全可以放心重构。越是大型的、多人合作的项目，类型信息能够提供的帮助越大。

静态类型的缺点 ​

静态类型也存在一些缺点：

  1. 丧失了动态类型的灵活性

部分情况下为了完善代码类型，会比使用 JS 的逻辑更复杂。

  1. 增加了编程工作量

除了上面的部分情况下逻辑更复杂之外，还需要编写功能之外的类型、确保类型正确，这增加了不少的工作量，有时会显著拖长项目开发时间。

  1. 更高的学习成本

  2. 引入了独立的编译步骤

相比于原生 JS，添加类型系统后需要增加单独的编译步骤才能运行。

  1. 兼容性问题

很多 JS 项目还没有做 TS 适配，虽然可以自己手动适配，但难免会有兼容性问题。