针对 Javascript 上面的问题,聪明的同学就想那我们就给 Javascript 加个类型吧,和 Java 一样,能够对变量的类型进行定义,这个想法就是 Typescript 的类型系统, 在很大程度上弥补了 Javascript 的带来的困惑。
从 Typescript 的名字就可以看出来,「类型」是其最核心的特性,Typescript 也主要致力于解决 Javascript 的类型混乱问题。
Typescript 是静态类型
类型系统按照「类型检查的时机」来分类,可以分为下面 2 种
- 动态类型
- 静态类型
动态类型是指在运行时才会进行类型检查,这种语言的类型错误往往会导致运行时错误。 Javascript 是一门解释型语言,没有编译阶段(这个就是另外一个针对 Java 同学经常吐槽的地方),所以它是动态类型,以下这段代码在运行时才会报错:
let foo = 1;
foo.split(' ');
// Uncaught TypeError: foo.split is not a function
// 运行时会报错(foo.split 不是一个函数),在运行的时候造成 bug。
// 打开你浏览器 F12 看看上面有多少错误你就能了解到了。
静态类型是指编译阶段就能确定每个变量的类型,这种语言的类型错误往往会导致语法错误。Typescript 在运行前需要先编译为 Javascript,而在编译阶段就会进行类型检查,所以 Typescript 是静态类型,这段 Typescript 代码在编译阶段就会报错了:
let foo = 1;
foo.split(' ');
// Property 'split' does not exist on type 'number'.
// 编译时会报错(数字没有 split 方法),无法通过编译
你可能会奇怪,这段 Typescript 代码看上去和 Javascript 没有什么区别呀。
没错!大部分 Javascript 代码都只需要经过少量的修改(或者完全不用修改)就变成 Typescript 代码,这得益于 Typescript 强大的[类型推论][],即使不去手动声明变量 foo 的类型,也能在变量初始化时自动推论出它是一个 number 类型。
完整的 Typescript 代码是这样的:
let foo: number = 1;
foo.split(' ');
// Property 'split' does not exist on type 'number'.
// 编译时会报错(数字没有 split 方法),无法通过编译
Typescript 希望通过上面的配置来增强 Javascript 的功能。
Typescript 类型系统 - 前端 - OSSEZ



