TypeScript 简介
Typed JavaScript at Any Scale.
添加了类型系统的 JavaScript,适用于任何规模的项目。
特性
- 它没有类型约束,一个变量可能初始化时是字符串,过一会儿又被赋值为数字。
- 由于隐式类型转换的存在,有的变量的类型很难在运行前就确定。
- 基于原型的面向对象编程,使得原型上的属性或方法可以在运行时被修改。
- 函数是 JavaScript 中的一等公民,可以赋值给变量,也可以当作参数或返回值。
静态类型
TypeScript 语言是静态类型,意思是:编译阶段就能确定每个变量的类型
let foo: number = 1;
foo.split(' ');
// Property 'split' does not exist on type 'number'.
// 编译时会报错(数字没有 split 方法),无法通过编译
上面是完整代码,可以简写成下面代码
let foo = 1;
foo.split(' ');
// Property 'split' does not exist on type 'number'.
// 编译时会报错(数字没有 split 方法),无法通过编译
简写后的代码与 JavaScript 看上去没有区别,这是因为 TypeScript 强大的类型推论
,即使不去手动声明变量 foo 的类型,也能在变量初始化时自动推论出它是一个 number 类型。
弱类型
typeScript 按照「是否允许隐式类型转换」来分类,可以分为强类型和弱类型。
以下这段代码不管是在 JavaScript 中还是在 TypeScript 中都是可以正常运行的,运行时数字 1 会被隐式类型转换为字符串 '1',加号 + 被识别为字符串拼接,所以打印出结果是字符串 '11'。
console.log(1 + '1');
// 打印出字符串 '11'
TypeScript 是完全兼容 JavaScript 的,它不会修改 JavaScript 运行时的特性,所以它们都是弱类型。
安装
在安装的 node/npm 的系统上运行下面命令
npm install -g typescript
此命令会在全局环境下安装 tsc 命令,tsc 命令用来编译 TypeScript 文件,例如:
tsc hello.ts
.ts 就是 TypeScript 编写文件的后缀。
.tsx 就是用 TypeScript 编写 React 的后缀。