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 的后缀。

添加新评论