一幅长文细学TypeScript（二）——TS的数据类型
2 TS的数据类型
摘要：为了让程序有价值，我们需要能够处理最简单的数据单元：数字，字符串，结构体，布尔值等。 TypeScript支持与JavaScript几乎相同的数据类型，此外还提供了实用的枚举类型方便我们使用。
声明：如果文章有错误请及时在评论区指出
作者：来自ArimaMisaki创作
2.1 类型注解
说明：我们说过，ts是对js弱类型的改进，改进方式是明确指出类型。
格式：变量名:数据类型
let age:number = 18;
age = 'hello';
console.log(age);
2.2 常用类型
JS已有类型（原始类型）：number/string/boolean/null/undefined/symbol/object
TS新增类型：联合类型、自定义类型、接口、元组、字面量类型、枚举、void、any等
2.3 原始类型
说明：这里只介绍布尔、数字、字符串
// 1.布尔值
let a:boolean = false;
console.log(a , typeof a);
// 2.数字
let b1:number = 6;
let b2:number = 0xf00d; //16进制
let b3:number = 0b1010; //2进制
let b4:number = 0o744; //8进制
console.log(b1);
console.log(b2);
console.log(b3);
console.log(b4);
// 3.字符串
let c1:string = 'bob';
let c2:string = "oh";
let c3:string = `Gene`; // 模板字符串写法
console.log(c1);
console.log(c2);
console.log(c3);
2.4 数组类型
// 常见语法
let numbers:number[] = [1,3,5]
// 数组泛型语法
let strings:Array<string> = ['a','b','c']
console.log(numbers);
2.5 元组类型
说明：元组和数组类似，但不同的是元组中元素的类型和数量已知。
// 1 定义元素类型
let x: [string, number];
// 2 初始化
x = ['hello',10]
// x = [10,'hello'] 报错，10不是string类型,'hello'不是number类型
console.log(x);
// x[2] = 'world' 报错，不能越界访问
console.log(x);
2.6 类型别名
说明：利用type我们可以为自定义的数据类型起一个别名。
// 使用type关键字来创建别名
type CustomArray = (number | string)[]
let arr1:CustomArray = [1,'a',3,'b']
let arr2:CustomArray = ['x','y',6,7]
console.log(arr1)
console.log(arr2)
2.7 函数类型
// 指定形参类型和返回值类型
function add1(num1: number, num2: number): number {
return num1 + num2
}
// 箭头函数语法 单独指定参数和返回值类型
const add2 = (num1: number, num2: number): number => {
return num1 + num2
}
// 箭头函数语法 同时指定参数和返回值类型
const add3: (num1: number, num2: number) => number = (num1, num2) => {
return num1 + num2
}
// 没有返回值类型
const add4 = (num1: number, num2: number): void => {
console.log(num1 + num2);
}
//可选参数 通过问号的形式说明可选
// 可选参数必须位于参数列表最后面，即可选参数后面不可出现必选参数
const mySlice = (start?:number,end?:number):void =>{
console.log('起始索引:',start,'结束索引',end);
}
console.log(add1(1, 2));
console.log(add2(2, 3));
console.log(add3(3, 4));
add4(4, 5)
mySlice(1)
2.8 对象类型
说明：对象类型可以很好地表示Object.create这样的API。
// 对象字面量
let person:{name:string;age:number;sayHi():void} = {
name:'ArimaMisaki',
age:13,
sayHi(){}
}
// 对象可选属性
let myAxios = (config:{url:string;method?:string}) => {
}
console.log(person);
// 对象类型可以很好地表示Object.create这样的API
declare function create(o: object | null): void;
create({ prop: 0 }); // OK
create(null); // OK
create(42); // Error
create("string"); // Error
create(false); // Error
create(undefined); // Error
2.9 枚举类型
说明：
enum类型是对JavaScript标准数据类型的一个补充。 像C#等其它语言一样，使用枚举类型可以为一组数值赋予友好的名字。- 默认情况下，从
0开始为元素编号。 你也可以手动的指定成员的数值。 - 枚举类型提供的一个便利是你可以由枚举的值得到它的名字。
enum Color {Red, Green, Blue}
let c: Color = Color.Green;
console.log(c); // 为1号位起名为Green
// 查看1号位对应的名字
let colorName:string = Color[1];
console.log(colorName);// Green
2.10 any
说明：
- typescript要求每个变量都有数据类型，但在实际应用中有时变量接收的是动态的数据，这时候我们可以指定变量类型为any，绕开编译阶段的检查。
- any类型可以用于替代联合类型
let a: any = 1
console.log(a,typeof a); //1 number
a = '12'
console.log(a,typeof a); //12 string
// 替代联合类型
let list:any[] = [1,'a',true];
list[1] = 100;
console.log(list , typeof list); //[1, 100, true] object
2.11 void
说明：当一个函数没有返回值时，它可以归为void类型。
let fn = ():void=>{
console.log("hello");
}
fn()
2.12 Never
说明：
- never类型表示永不存在的值的类型。
- never类型是任何类型的子类型，但任何类型都不是never的子类型。
// 返回never的函数必须存在无法到达的终点，如死循环
function infiniteLoop(): never {
while (true) {
}
}
2.13 联合类型
说明：联合类型是一种比较高级的类型，内容繁多，我们在这里稍加提一下及可，后面进行更深入的学习。
// 小括号必加 表明该数组中含有number类型和string类型
let arr:(number | string)[] = [1,'a',3,'b']
console.log(arr);
2.14 类型断言
说明：类型断言实际上可以理解为类型转换。有时候对于一些奇怪的数据类型TS可能无法做出判断，此时你可以使用类型断言的语法告诉它：你不知道让我来，我告诉你它是什么类型。
语法：
- <数据类型>变量名
- 变量名 as 数据类型
// ts不知道是什么类型，我们明确指出它是string类型
// 1.尖括号写法
let someValue1: any = "this is a string";
let strLength: number = (<string>someValue1).length;
// 2.as写法
let someValue2: any = "this is a string";
let strLength: number = (someValue2 as string).length;