TypeScript基础

一、简介

TypeScript 是以 JavaScript 为基础构建的语言，一个JavaScript 的超集，可以在任何支持JavaScript的平台中执行，TypeScript 扩展了JavaScript ，并添加了类型，同时TS 不能被JS解析器直接执行，需先转换为JS。

二、为TypeScript开发搭建环境

1、下载Node.js
2、安装Node.js
3、使用npm全局安装typescript
命令：npm i -g typescript
4、创建一个ts文件
5、使用tsc对ts文件进行编译
命令：tsc xxx.ts

三、基础类型

let a: number;    // 数字
a = 3;
let b: string;   // 字符串
b = 'bob'；
let c: boolean; //  布尔值
c = true;
let d: boolean | string;  // 或
d = true;
d = 'hello';

• any 表示的是任意类型，一个变量设置类型为any后相当于对该变量关闭了类型检测，使用TS时，不建议使用any类型。

let d: any;
d = true;
d = 'hello';
d = 10;

声明变量如果不指定类型，则TS解析会自动判断变量的类型为any(隐式的any)。

let d;
d = true;
d = 'hello';
d = 10;

• unknown 表示未知类型的值，实际上就是一个类型安全的any，不能直接赋值给其他变量。

let e: unknown;
e= true;
e= 'hello';
e= 10;

• 注意：
  any类型的值可以赋值给任意变量

let s: string;
s = d;  // d为any类型，同时改变了s的类型也为any
s = e;  // e为unknown类型，将报错不能讲unknown类型的值赋给string类型的值
if(typeof e === 'string') {  // 先做类型判断
    s = e;
}

• 类型断言：可以用来告诉解析器变量的实际类型
  语法：
  （1）变量 as 类型
  （2）<类型>变量

s = e as string;
s = <string>e;

• void 用来表示空，以函数为例，就表示没有返回值的函数

function fn(): void {}

• never 表示永远不会有返回结果

function fn2(): never {
    throw new Error('报错了！')
}

四、复杂类型

• object 表示一个对象

let a: object;  // 一般不这么用
a = {};
a = function(){}
// {}一般用来指定对象中可以包含哪些属性
// 语法：{属性名: 属性，属性名: 属性}
let obj : {
  name: string,
  age?: number,   // ? 表示可选属性
};
b = {name:'jack', age: 12};
// [propName: string] : any 表示任意类型的属性
let c: {name: string, [propName: string]: any};
c = {name: 'zhu', age: 13, gender: '女'};

// 设置函数结构的类型声明
//  语法：(形参: 类型，形参: 类型，...) => 返回值
let d: (a: number, b: number) => number;

• Array数组
  写法一：类型[]
  写法二：Array<类型>

let f:number[];  // 表示数值数组
let g:Array<number>;  // 表示数值数组

• 元祖，就是固定长度的数组
  语法：[类型，类型]

let h:[string, number];
h=['hello', 123];

• enum 枚举

enum Gender{
    Male,
    Female,
}
let i: {name: string, gender: Gender};
i = {
    name: '孙悟空',
    gender: Gender.Male 
}
console.log(i.gender === Gender.Male);

• &表示同时

let j: {name: string} & {age: number};
j = {name: '孙悟空', age: 18}

• 类型的别名

type myType = 1|2|3|4|5;
let k: myType ;
let l: myType ;
let m: myType ;