TypeScript 学习笔记(2)—— 基础

169 阅读3分钟

静态类型检测

TypeScript 可以在代码执行前检测出程序中可能存在的 bug。

非异常错误(Non-exception Failures)

对于有些不希望出现的情形,JavaScript 在处理时可能不报错,比如:访问对象中不存在的属性(这可能是由于拼写错误)、函数未调用直接参与运算、逻辑错误等,而 TypeScript 则会处理这些情形。

类型工具

类型检测器拥有一些信息,用于检查是否正确地访问对象属性;一旦拥有了这些信息,类型检测器也可以实现代码提示的功能。也就是说,TypeScript 既可以提供错误信息,又可以进行代码补全。

此外,那些支持 TypeScript 的编辑器还可以拥有自动查错、简单地重组代码、变量定义导航、找出给定变量的所有引用等功能,这些全都建立在类型检测器之上,而且完全是跨平台的。

tsc,TypeScript 编译器

全局安装 TypeScript 编译器 tsc:

npm install -g typescript

运行 TypeScript 编译器,将 ts 文件 <file> 编译为纯 js 文件:

tsc <file>

noEmitOnError

即使编译报错,js 文件也会照常生成,这源于 TypeScript 的核心观念:大部分情况下,用户对代码的了解比 TypeScript 更清楚。

但是,如果想要更强地防范错误,让 TypeScript 变得更严格,可以在编译时加上标记选项 noEmitOnError

tsc --noEmitOnError <file>

此时,如果 TypeScript 编译报错,将不再生成相应的 js 文件。

显式类型

显式注解变量类型:

function greet(person: string) {}

TypeScript 的隐式推断:

let msg = "hello msg!"; // let msg: string

鼠标悬浮到变量 msg 上面,编辑器会提示变量的类型。

删除类型

浏览器只能识别 JavaScript,因此需要 TypeScript 编译器将 TypeScript 代码编译为 JavaScript 代码。编译过程中,TypeScript 特有的代码会被删掉(或者转化),类型注解也包括在内。

降级(Downleveling)

除了将 TypeScript 转为 JavaScript 以外,TypeScript 编译器还会把 JavaScript 代码转换为较低版本。这种把新版本的 ECMAScript 转换为旧版 ECMAScript 的过程叫做降级(Downleveling)。TypeScript 默认的编译目标版本是 ES3,但使用编译器标记选项 target 可以对其进行修改。

tsc --target es2015 <file>

严格度

默认情况下,TypeScript 隐式推断出的类型较为宽松,也不会对可能出现的 nullundefined 进行类型检测。

但是,用户可能需要不同严格程度的类型检测,因此 TypeScript 提供了一些标记用以设置类型检测的严格度;CLI 中的 strict 标记,以及 tsconfig.json 中的 "strict": true,都可以同时打开这些标记;这些标记也可以单独打开,其中最常用的有以下两个:noImplicitAnystrictNullChecks

noImplicitAny

有时,TypeScript 会把变量隐式推断为最宽松的类型:any。如果想要采用更严格的检测,可以打开 noImplicitAny 标记,此时,TypeScript 将会在某些地方禁止变量被隐式推断为 any 类型,如:没有显式注解类型的函数参数。

function test(s) {
  // error TS7006: Parameter 's' implicitly has an 'any' type.
  console.log(s);
}

strictNullChecks

默认情况下,nullundefined 可以赋值给任何其它类型,换句话说,类型 nullundefined 默认为 TypeScript 中其它所有类型的子类型。打开 strictNullChecks 标记可以更严格地处理这两种类型,此时,类型 nullundefined 将和 number 等原始类型同级,而不再有父子类型关系。

let n: number;
n = null; // error TS2322: Type 'null' is not assignable to type 'number'.