简介
TypeScript是由微软公司开发的一个JavaScript的超集,主要提供了类型系统和对于ES6语法的支持。
特点
1、编译型语言:运行时需要先进行编译
2、强类型语言
3、面向对象的语言
优势
1、相较于弱类型语言JavaScript,TypeScript要求在变量定义时就指定变量的类型,在后续指定变量的值时,IDE会做出类型检测,提示出错误的地方,减少开发阶段犯错误的几率。
2、因为需要为变量指定类型,所以大多数的函数看看函数定义就知道如何使用,增加代码的可读性。
3、增强了编辑器和IDE的功能(代码提示、修改自动更新引用、接口提示等)
总结:TypeScript增强了代码的可读性和可维护性。
安装
主要有两种方式来获取TypeScript工具:
- 通过npm
- 安装Visual Studio的
TypeScript插件
Visual Studio 2017和Visual Studio 2015 Update 3默认包含了TypeScript。 如果你的Visual Studio还没有安装TypeScript,你可以下载它。
针对npm用户
npm install -g typescript
编写
TypeScript中.ts作为文件扩展名,使用变量名:变量类型的方式来为变量指定其类型。新建一个名为test.ts的文件,将以下代码输入到test.ts文件中。
function sayHi(person: string){
return 'hello ' + person;
}
console.log(sayHi('john')); // hello john
运行
运行ts有两种方式。
1、将ts文件编译为js文件运行
tsc test.ts
在同级目录下会生成一个test.js文件,运行这个test.js文件即可。
2、使用ts-node工具来直接运行ts文件, 在这里就不做详细叙述了,感兴趣的可以看看这篇文章 VSCode使用ts-node调试TypeScript代码
数据类型
TypeScript的数据类型包括两种,原始数据类型和对象类型
TypeScript的原始数据类型包括布尔值、数值、字符串、null、undefined 以及 ES6 中的新类型 Symbol。
原始数据类型
本节主要讲述布尔值、数值、字符串、null、undefined这五种数据类型在TypeScript中的应用。
布尔值
在TypeScript中使用boolean关键字来定义布尔值类型。
let isRead: boolean = true;
需要注意的是new Boolean(true)得到的不是布尔值。
let isDone: boolean = new Boolean(true);
//不能将类型“Boolean”分配给类型“boolean”。
//“boolean”是基元,但“Boolean”是包装器对象。如可能首选使用“boolean”。
上诉代码会报错,因为new Boolean(true)得到的并不是一个布尔值,而是一个Boolean对象。
当然如果直接调用Boolean(true)得到的就是一个布尔值。
const isDone: boolean = Boolean(true);
在TypeScript中boolean是原始数据类型,而Boolean则是构造函数,其他的基本类型(null和undefined除外)也是一样的。
数值
在TypeScript中使用number关键字来定义数值类型。
和JavaScript中一样TypeScript中所有的数都是浮点数,除了支持十进制和十六进制,TypeScript中还支持 ES6 中引入的二进制和八进制表示。
let decLiteral: number = 6;
let hexLiteral: number = 0xf00d;
// ES6 中的二进制表示法
let binaryLiteral: number = 0b1010;
// ES6 中的八进制表示法
let octalLiteral: number = 0o744;
let notANumber: number = NaN;
let infinityNumber: number = Infinity;
编译结果
var decLiteral = 6;
var hexLiteral = 0xf00d;
// ES6 中的二进制表示法
var binaryLiteral = 10;
// ES6 中的八进制表示法
var octalLiteral = 484;
var notANumber = NaN;
var infinityNumber = Infinity;
字符串
在TypeScript中字符串用string关键字来表示,和JavaScript一样可以使用"和'来表示字符串。
let name: string = 'john';
name = 'lucy';
对于模板字符串typescript也是支持的。
const name: string = 'adrien';
const age: number = 22;
const str: string = `my name is ${name}
I'll be ${ age + 1 } years old next month`;
对于上述定义 str 的方式与下面的结果相同
const str = "my name is " + name + "I'll be " + (age + 1) + " years old next month";
Null 和 Undefined
在typescript可以使用null 和 undefined来定义这两个数据类型。
const n: nulll = null;
const u: undefined = undefined;
在typescript中 null 和 undefined 是所有类型的子类型。也就是说 null 和 undefined 可以赋值给任何类型的变量。
const num: number = null;
const str: string = undefined;
// 上述的写法都是被允许的 不会报错