前端TS语法基础篇
本次一共推出三篇文章，TS基础篇、TS高阶篇、TS习题篇，三篇文章均已发布。
类型
ts大概有下面这几种类型，这些类型不仅仅是变量可以声明的类型，函数的返回值类型可以使用
- 布尔类型：boolean
- 数字类型：number
- 字符串类型：string
- 数组类型：array
- 元组类型：tuple
- 枚举类型：enum
- 任意类型：any
- null 和 undefined 类型
- void 类型
- never 类型
- 对象类型：object
1. 原始数据类型
下面简单举出几种类型 => number string boolean undefined null symbol
const str2: string = "1";
// let str2:number = "1"; // 报错，因为它的值类型为字符串
const bool: boolean = true;
const num3: number = 10;
const und: undefined = undefined;
const nul: null = null;
const sy: symbol = Symbol('123');
// Symbol创建出来的地址永远是新的（会创建新的内存空间）
// 例如：a = 123 b = 123，那么a的地址 = b的地址，而Symbol(123) != a
const vo: void = undefined; // void：空，js没有该类型
// void一般用于函数
function fn(): void {
// ts中，函数没有返回值，函数类型就为void
}
// 函数类型是undefined会报错，除非函数返回undefined
function fn1(): undefined {
return undefined
}
注意：这里需要提醒一点，就是如上方所写的 const str2: string = "1" ，其实大可以不写类型，可以直接写成const str2 = "1" 因为TS会有自带的类型推导，会自动推导成string类型，所以实际开发中往往会采用这种写法。函数的返回值也是一样，当返回值只有一种类型或者没有返回值，均不用写返回值类型，TS同样可以进行类型推导
2. ts的非原始类型
// ts非原始类型 object(常用) Object {}
let obj:object = {a: 1};
let arr:object = [1,2,3];
// let num:object = 20; // 报错，object不包含number类型
let obj1:Object = {b: 1};
let arr1:Object = [1,2,3];
let num:Object = 2; // 不会报错，Object包含
let str:Object = 'hello';
let bool:Object = true;
let obj2:{} = {b: 1};
let arr2:{} = [1,2,3];
let num2:{} = 2;
let str2:{} = 'hello';
let bool2:{} = true;
// {} 等效于 Object
// let arr:object = [1,2,3];
// 数组的元素一般数据类型都一致，便于处理
// 第一种写法：
let arr1:number[] = [1,2,3]; // 表示该数组中【元素】的数据类型为number
arr1[0] = 10;
// arr1[1] = "10"; // 报错
// 第二种写法：泛型 类型参数化
let arr2:Array<number> = [10, 20, 30]
arr2[0] = 10;
// arr2[1] = "10"; // 报错
// 元组（不同类型的数组）
let arr3:[number, number, boolean] = [10, 20, true]
arr3[0] = 20
// arr3[1] = '123' // 报错
arr3[2] = false
3. 联合类型
// 联合类型 | 或
let numAndStr:number|string = 10;
numAndStr = 'hello';
// 1|'2' 在这里的1 和 '2‘是类型， 常量，表示numAndStr2的值只能是 1 或 '2'
let numAndStr2: 1|'2' = 1
let numAndStr3: 1|'2' = '2'
// let numAndStr4: 1|'2' = 2 // 报错，只能是1 或 '2'中的一个
// 表明obj必须要有a 或 b属性，并且a的类型为1，或b的类型为'3'（可以a、b都有）
let obj:{a:1}|{b:'3'} = {a: 1};
// let obj:{a:1}|{b:'3'} = {a: 3}; // 报错
// let obj2:{a:1}|{b:'3'} = {a: '2'}; // 报错
let obj3:{a:1}|{b:'3'} = {b: '3'};
// let obj4:{a:1}|{b:'3'} = {b: 2}; // 报错
// let obj4:{a:1}|{b:'3'} = {b: '5'}; // 报错
4. 交叉类型
// 交叉类型 &
let a:number&string; // 不会有任何值满足这个类型（又是数字，又是字符串）❌
原文地址：https://blog.csdn.net/m0_62323931/article/details/140565304
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！