1.TypeScript是什么？
是以javascript语言为基础，是javascript的超集，
扩展了js，并添加了类型
可以在任何支持javascript的平台运行。
TS不能被JS解析器直接执行
所以TS需要进行转换，编译为JS代码，最后执行的还是js代码
- TS增加了什么
类型
支持ES的新特性
添加了ES不具备的特性
丰富的配置选项
强大的开发工具 - TS开发环境的搭建
安装nodejs
安装 typescript
npm i typescript -g
创建一个ts文件 xxx.ts
使用tsc对ts文件进行编译
进入命令行
进入ts文件所在目录
tsc xxx.ts
- 类型
类型声明
类型声明是TS非常重要的一个特点
通过类型声明可以指定ts中变量（参数、形参）的类型
指定类型后，当为变量赋值时，TS编译器会自动检查值是否符合类型声明，符合则赋值，否则报错。
简而言之，类型声明给变量设置了类型，使得变量只能存储某种类型的值。
语法：
//声明一个变量
let 变量:类型=值
let 变量:类型;
变量=值
//如果变量声明和赋值是同时进行的，TS解析器会自动检测变量的类型，会确定为值的类型，如果后面赋值为其他类型，则会提示错误。
let 变量=值
function(参数:类型,参数:类型):返回值类型{
}
类型
类型 例子 描述
number 1,33,2.5 任意数字
string "hi" 任意字符串
boolean true,false 布尔值true或false
字面量 其本身 限制变量的值就是该字面量的值
any 任意类型
unknown 类型安全的any
void 空值(undefined) 没有值或undefined
never 没有值 不能是任何值
object {name:"孙悟空"} 任意的JS对象
array [1,2,3] 任意js数组
tuple [4,5] 元素，TS新增类型，固定长度数组
enum enum(A,B) 枚举，TS中新增类型
// 可以使用字面量进行类型声明
let aa:10;
aa=10;
// 可以使用 | 来连接多个类型(联合类型)
let bb: "male" | "female";
let cc : boolean | string;
cc=true;
cc="hello"
// any表示任意类型，一个变量设置any之后相当于对该变量关闭了TS的类型检测
// 使用TS时，不建议使用any类型
// let dd:any;
// dd=false;
// dd=123;
//* 声明变量时如果不指定类型，则TS解析器会自动判断变量的类型为any (隐式的any)
let dd;
dd=20;
dd="123"
//* 如果一个变量的类型是any，它可以赋值给任意变量
// let e:string;
// e=dd;
// 如果一个变量的类型是unknown，它不能赋值给有类型的变量
// 它实际上是一个类型安全的any。
let e:string;
let eu:unknown;
e="hello ts"
eu="wjy";
if(typeof eu =="string"){
e=eu;
}
// 类型断言 可以用来告诉解析器变量的实际类型,以下两个作用是一样的
/*
- 语法：
- 变量 as 类型
- <类型> 变量
*/
e=eu as string
e= eu;
// e=eu;
// void 如果不设置函数的返回值，默认是void【没有或为空】
// 函数的返回值会自动类型检测，如果在分支判断中返回不同的值，则会返回值的类型就是 联合类型
function sum1(num){
if(num>0){
return true;
}else{
return 123
}
}
// void 用来表示空，以函数为例，就表示没有返回值
// void：空 | undefined | null
function fn():void{
// return undefined;
// return null;
return ;
}
// never不能是任何值
// 表示永远不会返回结果
function fn2():never{
throw new Error("报错了！")
}
// 联合值 f的只能为 10 20 30
let f: 10 | 20 | 30;
// 联合类型 ff的类型可以为 number string boolean
let ff: number | string | boolean;
- object【对象】
// 方式一：
let obj:object;
// 或
let obj:{};
// object 表示一个js对象
let a :object;
a={
name:"hyz",
age:22
};
// * 因为万物皆对象，所以实际用它是没有什么意义的
a=function(){}
// 方式二
let b:{};
b={
name:"wjy",
age:20
}
//可以指定一个变量的类型是对象，可以指定这个对象的属性有哪些，属性的类型是什么
let 变量名 :{
属性名:类型,
属性名:类型
}
let b: {
name:string
};
b={
name:"wjy",
age:20,// b会报错，因为指定的时候没有指定age属性
}
{}用来指定对象可以包含哪些属性和属性的类型
指定的属性的个数，多了一个属性也不行，少了一个属性也不行
1.1 如果想指定属性是可选的（可有可无）
可以在属性名后面 加 ?
let b:{
name:string,
age?:number
}
b={
name:"wjy"
}
1.2 规定对象指定属性是必须的，其他属性是可选的
let c:{[propName:string]:any}
let c:{name:string,[propName:string]:any};
c={
name:"wjy",
age:20,
isFlag:true
}
- 函数
// * 指定d的类型是一个函数，它的参数个数为两个，两个参数的类型都是number,返回值类型也为number
let d:(a:number,b:number)=>number;
d=function(n1,n2):number{
return n1+n2;
} - 数组
语法
let 变量名:类型[];
let 变量名:Array<类型>
// * 在ts中，数组一般存储的是相同的类型的值
let e:string[];// e是一个字符串数组，只能存储字符串
e=['a','b','c'];
let f:number[];// f是一个数组，存储的是number类型
let g:Array;//g是一个数组，存储的是number类型
g=[1,2,3,4,5]
- 元组(js无)
在js中是没有这个概念的，它表示固定长度的数组
语法：
let 变量名:[类型,类型,...]
let h:[string,string];
h=["hello","world"];//不会报错
h=["hello"];//报错
h=["hello","world","wjy"]//报错
赋值的时候不能多于指定的个数，也不能小于指定的个数
- 枚举(js无)
将所有可能的数据列出来
/**
- 枚举 enum：将所有可能的数据列出来
*/
enum Gender{
Male=1,
Female=0,
}
let i:{name:string,gender:Gender};
i={
name:"孙悟空",
gender:Gender.Male
}
console.log(i.gender===Gender.Male);
console.log(Gender.Male);
- &表示同时【语法】
&表示同时，表示都要满足，
// 表示j既是string类型，又是number类型，这个写法其实一点意义都没有
// 因为一个变量不可以同时满足两个类型的要求
let j:string & number;
// 表示j是一个对象，对象里面的属性既要有name属性，又要有age属性
let j:{name:string} & {age:number};
j={
name:"wjy",
age:20,
}
| 表示或【语法】
|表示或，表示只要满足一个就可以了。类型的别名
可以使用type定义一个类型，可以是基本类型，也可以是由字面量组成的类型。
// 定义了一个类型
type myType= 1|2|3|4|5;
let k: myType ;
let l :myType;
k=1;
