什么是 TypeScript?
TypeScript 是一个开源的编程语言,通过在 JavaScript(世界上最常用的语言之一) 的基础上添加静态类型定义构建而成。
类型提供了一种描述对象形状的方法。可以帮助提供更好的文档,还可以让 TypeScript 验证你的代码可以正常工作。
在 TypeScript 中,不是每个地方都需要标注类型,因为类型推断允许您无需编写额外的代码即可获得大量功能。
安装 TypeScript
你可以使用 npm 安装 TypeScript,之后执行 tsc 来运行 TypeScript 编译器
npm install -g typescript
TypeScript自动编译
运行 tsc --init ,创建tsconfig.json文件
修改 tsconfig.json 文件,设置js文件夹: "outDir":"/js"
设置VsCode监视任务,之后修改项中的ts,自动生成js
基础类型
TS里的类型注解是一种轻量级的为函数或变量添加约束的方式。
-
boolean(布尔)
let flag: boolean = false;
-
number(数字)
let _num: number = 1;
-
string(字符串)
let str: string = '123'
-
array(数组)
/*两种方式可以定义数组*/ let arr: number[] = [1, 2, 3]; /*第一种:在元素类型后面拼接[]*/ let arr: Array[number] = [1, 2, 3]; /*第二种:数组泛型,Array[元素类型]*/
-
Tuple(元组)
元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同。 比如,你可以定义一对值分别为 string和number类型的元组let x: [string, number]; x= ['haha', 1]; // ok x= [1, 'haha']; //error /*当对数组中的某个索引值进行方法处理时,这是要注意对应索引的值的类型,如下:*/ console.log(x[0].substr()) //ok, string存在substr方法 console.log(x[1].sunstr()) //error, number不存在substr方法 /*给未定义索引增加值时:*/ x[3]= '1212'; // ok x[4]= 1212; //ok X[5] = ture; // Error, 布尔不是(string | number)类型
-
enum(枚举)
枚举是一个可被命名的整型常数的集合,枚举类型为集合成员赋予有意义的名称增强可读性。enum Color {red,green,blue}; let c: Color = Color.blue; console.log(c); //2 枚举默认下标是0,也可以手动修改,下标依次增加1 enum Color {red = 2,green = 3,blue = 6, yellow}; let c: Color = Color.blue; console.log(c); //6 console.log(yellow); //7
-
any(任意)
任意值是TypeScript针对编程时类型不明确的变量使用的一种数据类型,常用于以下三种类型:1、值可能来自于动态的内容,比如来自用户输入或第三方代码库。 这种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。 let _any: any = '12' 2、允许你在编译时可选择地包含或移除类型检查 let x: any = 4; x.toFixed(); //正确,并不检查是否存在 3、定义储存各种类型数据的数组时 let arrarList: any[] = [1,'qwe',true];
-
void
使用void表示没有任何类型,例如一个函数没有返回值(即没有return值出来),意味着返回void,void类型只能为undefined和nullfunction arr():void{ console.log('ahhahahah') } let unusable: void = null /*一个变量声明void类型没有什么意义*/
-
Null 和 Undefined
TypeScript里,undefined和null两者各自有自己的类型分别叫做undefined和null。 和 void相似,它们的本身的类型用处不是很大let u: undefined = undefined; let n: null = null; 注意:null和undefind是所有类型的子类,也就是说在其它类型下,赋值null或者undefind都是可以的; 然而,当你指定了--strictNullChecks标记,null跟undefind就只能注解自己对应的类型了。 strictNumChecks标记在tsconfig.json下配置"strictNullChecks": true即可 (官方提示强烈推荐使用)
-
Never
never是其他类型(包括null和undefined)的子类型,代表从不会出现的值,这意味着声明为never类型的变量只能被never类型所赋值,在函数中通常表示为抛出异常或无法执行到终止点。let x: never; let y: number; //报错 x = 123; //正确 y = x;