类型声明
通过类型声明可以指定TS中变量(参数、形参)的类型
指定类型后,当为变量赋值时,TS编译器会自动检查值是否符合类型声明,符合则赋值,否则报错。简而言之,类型声明给变量设置了类型,使得变量只能存储某种类型的值。
语法:
let 变量: 类型;
let 变量: 类型 = 值;
function fn(参数: 类型, 参数: 类型): 返回值类型{ }
1.基础/基元类型
Number、string、boolean
let num : number = 1; //数值
let str: string = 'abc'; //字符串
let bool: boolean = true; //布尔值
2.数组类型
let list: number[ ] = [1, 2, 3]; //数值数组
let list: Array<number> = [1, 2, 3]; //泛型语法
let list: any[ ] = ['abc', 1, { name: 'doudou' }]; //任意值数组
3.对象类型
{ }用来指定对象中可以包含哪些属性
语法:{属性: 属性值, 属性: 属性值...}
let obj:{name:string,age:number}={
name:"doudou",
age:22
}
注意:如果在使用对象的时候 必须给每个属性都要传入对应的值 否则会报错
4.可选属性
在属性名后面加?,表示该属性是可选的
let obj:{name:string,age?:number}={
name:"doudou" // age为可选属性,所以不传之也不会报错
}
5.null与unfined类型
let u: undefined = undefined; //unfined 定义未初始化的值
let n: null = null; //null 定义不存在的
6.enum 枚举
TS中新增类型 使用枚举类型可以为一组数值赋予友好的名字。枚举表示的是一个命名元素的集合值。
enum user{xiaoming,xiaohong,xiaobai}
console.log(user.xiaohong) //默认情况下数据的值从0开始
// 同时也会对枚举值到枚举名进行反向映射
console.log(user[0] === "xiaoming"); // true
console.log(user[1] === "xiaohong"); // true
console.log(user[2] === "xiaobai"); // true
// 设置值
enum user{xiaoming,xiaohong=99,xiaobai}
console.log(user.xiaoming) //0
console.log(user.xiaohong) //99
console.log(user.xiaobai) //100
7.tuple元组
元组,TS新增类型,元组类型用来表示已知元素数量和类型的数组,各元素的类型不必相同,对应位置的类型需要相同(赋值的顺序不能变)
let x: [string, number];
x = ["doudou", 22];
let x: [string, number];
x[0] = 'doudou';
x[1] = 22;
let x: [string, number];
x[0] = 'doudou';
let x: [string, number];
x = ['doudou', 22];
// 若只赋值一项会报错
let x: [string, number];
x = ['doudou']; //不能将类型“[string]”分配给类型“[string, number]”。源具有1个元素,但目标需要2个。
当添加越界的元素时,它的类型会被限制为元组中每个类型的联合类型:
let x: [string, number];
x = ['doudou', 22];
x.push('doudou'); //可以添加string
x.push(true); //但不能添加boolean
8.any
TS中对于被标记为 any 类型的变量,是没有进行类型检查而直接通过编译阶段的检查(关闭了类型校验)。
let x: any = 4;
x = 'doudou';
x = true;
如果是 any 类型,则允许被赋值为任意类型。在任意值上访问任何属性都是允许的,也允许调用任何方法。
声明一个变量为任意值之后,对它的任何操作,返回的内容的类型都是任意值。
9.void
JavaScript 没有空值(Void)的概念,在 TypeScript 中,可以用 void 表示没有任何返回值的函数:
function fun(): void {
console.log("abc");
}
let unusable: void = undefined;