一、TypeScript

1. 以JavaScript为基础构建的语言。
2. 可以在任何支持JavaScript的平台中执行。
3. 一个JavaScript的超集。
4. TypeScript扩展了JavaScript并添加了类型。
5. TypeScript不能被JS解析器直接执行，需要编译为JavaScript.

二、TypeScript增加的内容

• 类型
• 支持ES的新特性，和ES不具备的新特性
• 丰富的配置选项
• 强大的开工具

三、TypeScript开发环境搭配

1. 下载并安装node.js
2. 使用npm安装，在cmd中输入 :node -v查看是否安装成功：
3. 全局安装typeScript:npm install typescript --save-dev
4. 验证是否安装typescript:tsc

四、基本类型

1、类型声明

• 类型声明是TS非常重要的特点
• 通过类型声明可以指定TS变量（参数、形参）的类型
• 指定类型后，当为变量赋值，TS编译器会自动检查值是否符合类型声明，符合则赋值，否则报错
• 简而言之，类型声明给变量设置了类型，使得变量只能存储某个类型的值
• 语法

let 变量: 类型;
let 变量:类型 = 值;
function fn(参数：类型，参数:类型){
    /* 函数体 */
}

以下写法用的不多，

// 声明变量a，同时指定变量a类型为number
// a的类型设置为number,在之后a的类型只能是number,当a赋值成其他类型会报错
var a;
a = 10;
// a ="111" 由于变量a的类型是number，不能赋值为字符串，会报错
// 声明变量b并赋值,同时指定变量b为string类型
var b = "B";
// 声明完变量直接赋值
var c = true;
// 如果变量的声明和赋值是同时进行的，TS可以自动对变量进行类型检测
var d = false;
// 把ts转为js文件，ts文件的里的let会变成var
function sum(n1, n2) {
    return n1 + n2;
}

执行tsc.01_w.ts

// 声明变量a，同时指定变量a类型为number
// a的类型设置为number,在之后a的类型只能是number,当a赋值成其他类型会报错
let a:number;
a = 10
// a ="111" 由于变量a的类型是number，不能赋值为字符串，会报错
// 声明变量b并赋值,同时指定变量b为string类型
let b:string = "B";
// 声明完变量直接赋值
let c:boolean = true;
// 当对变量的声明和赋值是同时进行的，TS编译器会自动判断变量的类型
let d = false
// 把ts转为js文件，ts文件的里的let会变成var
function sum (n1:number,n2:number):Number{
    return n1+n2
}

2、自动类型判断

• TS拥有自动的类型判断机制
• 当对变量的声明和赋值是同时进行的，TS编译器会自动判断变量的类型
• 所以如果你的变量的声明和赋值同时进行的，可以省略掉类型声明

3、类型

类型	例子	描述
number	1,-2,2.3	任意数字
string	"s",'s',s	任意字符串
boolean	true,false	布尔值
字面量	其本身	限制变量的值就是该字面量的值
any	*	任意类型
unknow	*	类型安全的any
void	空值（undefined）	没有值（或undefined）
never	没有值	不能是任何值
object	{name:yt}	任意的JS对象
array	[1,2,3]	任意JS数组
tuple	[1,2]	元素，TS新增类型，固定长度数值
enum	enum{A,B}	枚举，TS中新增类型

（1）字面量

// 直接使用字面量进行类型声明
// a被赋值为10，a可以再次被赋值为10，但是a不能在被赋值为除10以外的数字（例如11，2......）
let a:10;
// 其中"|"标识或，【可以使用|连接多个类型】
//b可以再次赋值为"male"或“false”，不能在赋值其他字符串
let b:"male"|"false"
// 表示c赋值可以是boolean或string类型（联合类型）
let c:boolean | string

（2）any、unknown（类型断言）

// any表示的是任意类型，一个变量设置类型为any后相当于对该变量关闭了TS的类型检测
// 在TS开发中不建议使用any
// 声明变量如果不指定类型，则TS解析器会自动判断变量的类型为any(隐式的any)
let e: any;
e = 10;
e = "eee";
e = false;
let s: string;
// e的类型是any,它可以赋值给任意的变量（any会影响其他变量）
s = e;
// unknown表示未知类型的值
let u: unknown;
u = 10;
u = "111";
u = true;
let s2: string;
// s2=u:unknown会报错，这就是与any的区别
//如果实在想把s2的赋值给u，
// 方法一：可以进行类型判断
if (typeof e === "string") {
  s = e;
}
// 方法二：类型断言:告诉解析器变量的实际类型[e就是字符串]（当知道e的类型）
// 写法1
s=e as string;
// 写法2
// s= <string>e 

（3）void、never

// 如果fun()后不设置类型，编辑器会自动判断类型
function fn(): boolean {
  return true;
}
// 如果函数没有返回值就使用void[void用来表示空，就表示没有返回值的函数]
function fn2(): void {}
// never 表示永远不会返回结果
function fn3(): never {
    throw new Error("报错了！")
}

（4）object

// object表示一个js对象（不实用）
let a: object;
a = {};
a = function () {};
// b指向一个对象，对象里有name属性为string类型(实用)
// {}用来指定对象中可以包含哪些属性
// 语法：{属性名:属性值,属性名:属性值}
// 注意：b的赋值值属性要一致,属性名后加"?"表示age赋值时可有可无
let b: { name: string; age?: number };
b = { name: "yt" };
// 当属性数量未知对象的处理
// [propName:string]任意字符串的属性名：any任意类型
let c: { name: string; [propName: string]: any };
c = { name: "yt", age: 10 };

/**
 * 设置函数结构的类型声明
 * 语法（形参：类型，形参：类型...）=>返回值
 */
let d: (a: number, b: number) => number;
d = function (n1, n2):number {
  return n1 + n2;
};

(4)Array

/**
 * 数组的类型声明
 * 类型[]
 * Array<类型>
 */
// string[]表示字符串数组
// 写法一
let s:string[];
s=["a","b","c"];
// 写法二
let s2:Array<string>;

// number[]表示数字数组
let n:number[];
n=[1,2,3,4];
let n2:Array<number>

(5)tuple

/**
 * 元组，固定长度的数组
 * 语法:[类型，类型，类型]
 */
let t: [string, string];
t = ["1", "2"];
let t2: [string, number];
t2 = ["a", 11];

(6)enum

/**
 * enum枚举
 * 把所有存在的情况都列举出来
 */
enum Gender {
  Male = 0,//男
  Female = 1,//女
}
let i :{name:string,gender:Gender};
i = {
  name:"yt",
  gender:Gender.Female//性别女
}
console.log(i.gender === Gender.Male);

(7) &

// &表示同时,a要同时含有name和age
let a:{name:string} & {age:number};

(8)type 类型的别名

let k: 1 | 2 | 3 | 4 | 5;
let l: 1 | 2 | 3 | 4 | 5;
// 以上k和l的重复赋值1-5的数字范围，有点麻烦，可以使用类型的别名
/* type 别名=范围  可以简化类型的使用 */
type myType = 1 | 2 | 3 | 4 | 5;
let m: myType;