TypeScript简介
- TypeScript是JavaScript的超集。
- 它对JS进行了扩展，向JS中引入了类型的概念，并添加了许多新的特性。
- TS代码需要通过编译器编译为JS，然后再交由JS解析器执行。
- TS完全兼容JS，换言之，任何的JS代码都可以直接当成TS使用。
- 相较于JS而言，TS拥有了静态类型，更加严格的语法，更强大的功能；TS可以在代码执行前就完成代码的检查，减小了运行时异常的出现的几率；TS代码可以编译为任意版本的JS代码，可有效解决不同JS运行环境的兼容问题；同样的功能，TS的代码量要大于JS，但由于TS的代码结构更加清晰，变量类型更加明确，在后期代码的维护中TS却远远胜于JS。
类型声明
- 变量和函数类型声明——声明变量的同时声明类型。
语法：let 变量: 类型;
let a: string;
- 声明变量同时声明类型+赋初始值。
语法：let 变量: 类型 = 值;
let b: number = 3;
b = '';
- 声明变量时直接赋值,TS可以对变量类型进行检测。
语法：let 变量 = 值；
let c = 3;
c = true;
- & 且,合并多种类型。
语法：let 对象: 类型1 & 类型2
let obj5: {name:string} & {age:number}
obj5 = {name: '悟空', age: 10}
- 使用字面量进行类型声明，变量的值是该字面量的值。
语法：let 变量：值
语法：可以使用 | 来连接多个类型
// let d: 'e' | 'f';
let d: number | string;
d = 1;
d = 'f';
- any 表示任意类型。
一个变量设置类型为any后相当于对其关闭了TS的类型检测;
any可以赋值给任意类型的值，不安全，不建议使用;
声明变量时不赋值也不声明类型，相当于any类型。
/**一个变量设置类型为any后相当于对其关闭了TS的类型检测*/
let m : any;
m = true;
m = false;
/**any可以赋值给任意类型的值，不安全，不建议使用*/
let o: string | number;
o = m;
console.log(typeof o);
/**声明变量时不赋值也不声明类型，相当于any类型*/
let n;
n= true;
- unknown 实际上是一个类型安全的any。
unknown类型的变量，不能直接赋值给其他类型的变量；
要用if判断或者类型断言。
let un: unknown;
un = 1;
un = true;
// if判断
let o: string | number;
if ( typeof un === 'string') {
o = un;
}
- 类型断言,可以用来告诉解析器变量的实际类型。
语法： 变量 as 类型 | <类型>变量
let o: string | number;
let un: unknown;
o = un as string;
o = <string>un;
- void用来表示空。
function fn1(){
// return 1;
// return undefined;
return null;
}
let v: void;
// v = undefined;
v = fn1();
- never类型没有返回值，是任意类型的子集，可以赋值给任意类型，但不能被任意类型赋值（包括any）,除了自身。例如：抛出错误
throw new Error('报错')。
function fn2():never {
throw new Error()
}
- object 表示js对象，广义上的。
语法：{key1：类型， key2：类型}，用来指定对象中包含哪些属性，key值及value的类型
let obj4: object;
obj4 = {};
obj4 = [];
obj4 = function () {};
let obj7: {name: string, age: number};
obj7 = {name: 'yan', age: 18};
- 在属性名后面加上？，表示该属性是可选的。
语法： {key1：类型， key2？：类型}
let obj2 : {name:string, age?: number};
obj2 = {name:'pig'}
-
[propName: string]: any,表示任意个数的属性，propName可以用任意值表示。
语法： {key1：类型， [propName: string]: any}
let obj3: {name:string, [xx: string]: any}
obj3 = {name: 'a', age:12, gender: 'male'};
- TS函数中的规定参数的类型和个数,规定返回值类型。
语法：function fn(参数: 类型, 参数: 类型): 类型 {...}
function fn(a:number, b:number){
return a +b;
// return a + '';
}
fn(1, 10); // 11
fn(1, '10') // 110 这个例子说明了类型声明的重要性，没有类型校验的话，函数会返回意料外的值，并且没有错误提示。
- 设置函数结构的参数和返回值类型声明。
语法：let 变量: (a:类型, b:类型) => 类型，a、b可以是任意值形参名
let fn3: (a:number, b:number) => number;
fn3 = function (n1: number, n2: number) {
return 10;
}
- 数组的类型声明。
语法：let 变量: 类型[] | Array<类型>
let arr1: number[];
arr1 = [1, 2];
let arr2: Array<number>;
arr2 = [1, true, '2'];
- 元组: 数组长度固定，每一项数组类型固定。
语法：[类型，类型，类型]
let y: [string, number, boolean]
y = ['', 1, true]
- 枚举enum。
语法：enum 枚举类型{ 类型1 = 0, 类型2 = 1}
enum Gender{
Male = 0,
Female = 1
}
let p : {name: string, gender: 0|1 }
p = {name: '志远', gender: Gender.Male}
- 类型的别名
语法：type 别名 = 1|2|3；
type t1 = 1|2|3;
let aa : 1|2|3;
let bb: 1|2|3;
let cc: t1;
cc = 1;
