`Typescript`中的基本类型

学习文档 官方文档

类型声明

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

语法：

let 变量: 类型;

let 变量: 类型 = 值;

function fn(参数: 类型, 参数: 类型): 类型(返回值类型的声明){
    ...
}

自动类型判断

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

代码展示:

// 类型变量的声明

// 方法1: 附带类型限制
let a:number = 1 //此时限制了a只能赋值为数值型
// a = 'abc' // 此时如果给a赋值为字符串型就会报错

// 方法2: 自动类型判断(用的较多)
let b = 12 // 如果我们在声明变量的时候就给该变量赋值(声明和赋值同时进行)就可以省略类型限制声明
// b = 'abc' // 此时如果给b赋值为字符串型就会报错

/*
    由上述可见,ts中的类型限制声明并未给我们在变量赋值中带来有多大的好处,我们真正用类型限制声明
    多的地方在于函数的形参声明,用于限制形参的传入
*/

/*
    举个简单的例子: 我们设置一个求和函数,用于数字的加法求和,我们都知道,加法求和是对于数字来讲的,
    但是传统的js函数并没有限制类型声明这一说法,也就是说,只要是合法的数据,函数的形参都能接收,这样
    这个加法函数就显得不是那么的合理了,两个数值型的参数传入固然能实现求和运算,但是如果其中一个是
    字符串形式的话输出的就是字符串拼接而不是求和了
*/ 

// js形式的函数(无限制类型声明且无法在ts中输出)
function sum1(a , b) {
    console.log(a+b);
}

sum1(1,2)// 此时是正确输出为1+2=3
sum1(1,'2')// 此时是错误输出为1+'2'='12'

// ts形式的函数(无限制类型声明)
function sum2(a:number , b:number) :number{//后面的限制类型声明返回值为number类型
    console.log(a+b);
    return a+b
}

/*正确输出:*/ sum2(1,2)// 此时是正确输出为1+2=3
/*报错输出:*/ sum2(1,'2')// 传递参数类型错误会报错
/*报错输出:*/ sum2(1,2,3)// 传递参数过多错误会报错
/*报错输出:*/ sum2(1)// 传递参数过少错误会报错

基本类型

类型	例子	描述
number	1, -33, 2.5	任意数字
string	‘hi’, “hi”, `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中新增类型

代码展示:

代码1(字面量 - never)

// 1.字面量类型声明(相当于常量声明)
let a: 10;
a = 10;

// 可以使用 | 来连接多个类型（联合类型）
let b: "male" | "female";
b = "male";
b = "female";

let c: boolean | string;
c = true;
c = 'hello';

// 2.any 表示的是任意类型，一个变量设置类型为any后相当于对该变量关闭了TS的类型检测(一般不推荐使用)
// 使用TS时，不建议使用any类型(会污染其他变量)
// let d: any;

// 声明变量如果不指定类型，则TS解析器会自动判断变量的类型为any （隐式的any）
let d;
d = 10;
d = 'hello';
d = true;

// 3.unknown 表示未知类型的值(如果不知道赋值类型的话推荐使用)
let e: unknown;
e = 10;
e = "hello";
e = true;

let s:string;

// d的类型是any，它可以赋值给任意变量(此时会污染s变量,将s也转换成any类型)
// s = d;

e = 'hello';

// unknown 实际上就是一个类型安全的any
// unknown类型的变量，不能直接赋值给其他变量
if(typeof e === "string"){
    s = e;
}

// 4.类型断言，可以用来告诉解析器变量的实际类型
/*
* 语法：
*   变量 as 类型
*   <类型>变量
*
* */
s = e as string;
s = <string>e;

// void 用来表示空，以函数为例，就表示没有返回值的函数
function fn(): void{
}

// never 表示永远不会返回结果
function fn2(): never{
    throw new Error('报错了！');
}

代码2(object - enum)

// 1. object表示一个js对象
let a: object;
a = {};//直接声明
a = function () {//函数式声明
};

// {} 用来指定对象中限制包含哪些属性(属性名对应的属性类型以及属性的个数)
// 语法：{属性名:属性值,属性名:属性值}
// 在属性名后边加上?，表示属性是可选的
let b: {name: string, age?: number};
b = {name: '孙悟空', age: 18};

// [propName: string]: any 表示任意类型的属性
let c: {name: string, [propName: string]: any};
c = {name: '猪八戒', age: 18, gender: '男'};

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

/*
*   2. 数组的类型声明：
*       类型[]
*       Array<类型>
* */
// string[] 表示字符串数组
let e: string[];
e = ['a', 'b', 'c'];

// number[] 表示数值数值
let f: number[];

let g: Array<number>;
g = [1, 2, 3];

/*
*   3. 元组，元组就是固定长度的数组
*       语法：[类型, 类型, 类型]
* */
let h: [string, number];
h = ['hello', 123];

/*
*   4. enum 枚举(类似于对象)
*
* */
enum Gender{
    Male,
    Female
}

let i: {name: string, gender: Gender};
i = {
    name: '孙悟空',
    gender: Gender.Male // '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;

k = 2;

Typescript中的基本类型

类型声明

自动类型判断

代码展示:

基本类型

代码展示:

`Typescript`中的基本类型