TypeScript 初识

1、创建ts环境

 安装全局ts环境

npm install -g typescript

 创建ts配置文件

tsc -init

编译ts文件

tsc demo.ts

2、基本数据类型

ts 的关键之处就在于他的类型定义，在ts中我们给一个变量赋值了之后，他的类型就固定下来了，你可以去改它的值，但不能改变它的类型。

并且因为ts是静态类型定义，它在你写代码的时候就会报错，而不是等到编译的时候才报错，而js是动态类型定义，你写代码的时候它是不知道这是什么类型的，要等到编译时才会知道类型，因此如果报错那就只会在运行的时候才会报错，这样就很不友好。

这么写 和 let str = "1" 这么写是一样的，不加string ts会自己去根据你值去推导出它的类型

let str:string = "1" ; 

let str2 = "1"//此时 str2 的类型就等于string
//str = 1 //将值赋值为数值类型的1 就会直接报错

let numb:number = 1;
// let numb:number = true; // 这么写就会直接报错，ts中定义好了类型的话，就必须使用这个类型，不能使用其他的类型
let stri:string = "aaa";
numb.toFixed(1);//toFixed 保留几位小数
// stri.toFixed(1) // 但是如果让string类型来调用这个方法 那就会直接报错
let bool:boolean = true;
let sym:symbol = Symbol(111);
let nul:null = null;
let und:undefined = undefined;

 void类型 代表空 赋值的话必须赋值undefined 但我们一般不这么用

let voi:void = undefined;

void 通常用来代表 一个函数的返回值类型，必须写在括号后面 如果一个函数没有返回值，那么它的类型就是void。

function foo():void { 

}

 这个意思 就是这个函数的返回值类型必须是number，如果不返回number类型它就会报错

function foo2():number {
    return 1
}

2、复杂类型

在ts 中 定义复杂类型有三种方式，object Object 以及  {}；

这三种方式我们一般使用第一种，因为object只代表数组和对象，而后两者可以定义所有类型，因此就不好区分了

let obj:object = { a:1 }
let arr:object = [1,2]
// let num:object = 1 // 报错

 Object 和 {} 这两种 可以直接定义所有类型，不好明确，因此这两个我们一般不用

let obj1:Object = {};
let arr1:Object = [1,2,3];
let num1:Object = 1;
let str1:Object = 'aaa';

这是定义数组的另外一种方式，这种方式也是我们比较常见的一种方式。

let arr2:number[] = [1,2,3,4,5];
let strs:string[] = ['a','b','c'];
let objs:object[] = [ {a:1} , {a:2} ];

arr2:number[] 代表这是一个纯number类型的数组，数组的每一项都必须是number类型，否则会报错。

这种方式代表的是 泛型（类型参数化） ， 也可以定义一个number类型的数组。

let arr3:Array<number> = [1,2,3,4,5]

这种类型不固定的数组 就是元组 它内部的项的类型并不固定。

let arr4:[number,string] = [11,'aa'];

我们这种方式定义的多类型数组，它就固定死了，长度也固定了。

我们一般用这种方式来定义多类型的联合类型数组，这种方式和上面那种比起来它就比较灵活。

let arr5:(number|string|boolean)[] = [11 , 22 , 33 , 'aa' , 'bb' , true , 1 , 'aaa'];

3、联合和交叉类型

这种用 或 符号来分割的就是联合类型，也很好理解，代表的就是这个变量要么是number，要么是string。

let num:number|string = 10;
num = 'aaa'

这种写法那就等同于常量了，此时num必须为11 或者 'aaa' 的其中一个，否则会报错。

let num2:11|'aaa' = 11
num2 = 'aaa';
// num2 = 123 // 报错 

let obj:{a:1}|{b:1} = {a:1};
obj = { b:1 };
// obj = { a:1, c:1 } //报错 因为这里有 c:1 ，因此这里会报错，这个对象必须是上面定义的两个中的其中一个 

这种用 与 符号关联的就是交叉类型，代表条件必须全部满足才行，也就是说这个obj 必须 由 name age height 这三个组成，并且类型也必须符合，不能多，也不能少。

let obj2: { name:string , age:number } & { height:number };
obj2 = {
    name : 'zhangsan',
    age:18,
    height:1.85,
    // gender:1 // gender是没有指定 因此加上就会报错
}

4、any和unknown

any 代表绕过类型校验，加上any就等同于在写js了，我们一般不推荐使用any。

let num:any = 1;
num = 10;
num = '11';
num = [];
num.toFixed(11);//不会报错 因为已经完全不做类型检测了

unknown 和any不同， any 代表的是完全绕过类型检测，unknown则代表未知类型，也就是说它并不会绕过类型检测，而是类型并不确定，也就是说它仍然会做类型检测。例如下面的例子，我们直接调用number类型的toFixed方法，就会报错，因为它类型未知，并不确定是否是number类型，因此也就调用不了

let num2:unknown;
num2 = 1;
// num2.toFixed(1) // 报错 因为unknown代表未知类型，既然未知那就不能直接调用number类型的方法，否则会报错
num2 = 'aa';
num2 = [];

但如果我们加上if判断，此时它就能调用number类型的方法了，因为此时类型确定为number了。

if(typeof num2 === 'number') {
    num2.toFixed(1);
}