前端文档TS 数据类型 ¶
JS六种数据类型 ¶
基本类型：
number 数值
string 字符串
boolean 布尔值
undefined 未定义
null 空指针(定义了但是为空)
复杂数据类型(引用类型)：
object 对象
ES6新增 ¶
1. symbol ¶
symbol类型的值是通过Symbol构造函数创建的。
js
let sym1 = Symbol();
let sym2 = Symbol("key");
let sym2 = Symbol("key");
let sym3 = Symbol("key");
sym2 === sym3; // false, symbols是唯一的let sym1 = Symbol();
let sym2 = Symbol("key");
let sym2 = Symbol("key");
let sym3 = Symbol("key");
sym2 === sym3; // false, symbols是唯一的symbol是不可改变且唯一的。 symbol也可以被用做对象属性的键
js
let sym = Symbol();
let obj = {
[sym]: "value"
};
console.log(obj[sym]); // "value"let sym = Symbol();
let obj = {
[sym]: "value"
};
console.log(obj[sym]); // "value"2. bigint 大整数 ¶
TS数据类型 ¶
1. boolean 布尔类型 ¶
js
let flag:boolean = true;let flag:boolean = true;2. number 数字类型 ¶
js
// TS 如果能实现 float double 型就好了 很明显10.2 不是整型
let num1:number = 10;
let num2:number = 10.2;// TS 如果能实现 float double 型就好了 很明显10.2 不是整型
let num1:number = 10;
let num2:number = 10.2;3. string 字符串类型 ¶
js
let name: string = 'welcome';
name += ' to';
name = `${name} typescript`;let name: string = 'welcome';
name += ' to';
name = `${name} typescript`;4. array 数组类型 ¶
js
let arr1:number[] = [1, 2, 3]; //所有项为number
let arr2:Array<string> = ['1', '2', '3']; //所有项为string
let arr3:any[] = [ 'hello', 1, { id: 110 } ]; //每一项为任意类型let arr1:number[] = [1, 2, 3]; //所有项为number
let arr2:Array<string> = ['1', '2', '3']; //所有项为string
let arr3:any[] = [ 'hello', 1, { id: 110 } ]; //每一项为任意类型5. tuple 元组类型 ¶
js
//1. 可以给每个位置指定一种数据类型
let x:[ number, string ] = [10, 'hello']
//2. 方法体返回元组
function useInfo(){
const name: string = 'hello';
const age: number = 30;
return [name, age] as const;
}
const [name, age] = useInfo()//1. 可以给每个位置指定一种数据类型
let x:[ number, string ] = [10, 'hello']
//2. 方法体返回元组
function useInfo(){
const name: string = 'hello';
const age: number = 30;
return [name, age] as const;
}
const [name, age] = useInfo()6. enum 枚举类型 ¶
js
//后端返回 orderStatus字段：1.未支付 2.已支付 3.已取消 4.已关闭
const orderStatus = 1;
//枚举使用
enum orderStatusCode {
UN_PAYED = 1,
PAYED = 2,
CANCELED = 3,
CLOSED = 4,
}
//Record: 他会将一个类型的所有属性值都映射到另一个类型上并创造一个新的类型.
const orderStatusDesc: Record<orderStatusCode, string> = {
[orderStatusCode.UN_PAYED]: '未支付',
[orderStatusCode.PAYED]: '已支付',
[orderStatusCode.CANCELED]: '已取消',
[orderStatusCode.CLOSED]: '已关闭'
}
//打印结果为 订单状态: 未支付
console.log('订单状态:' + orderStatusDesc[orderStatus])//后端返回 orderStatus字段：1.未支付 2.已支付 3.已取消 4.已关闭
const orderStatus = 1;
//枚举使用
enum orderStatusCode {
UN_PAYED = 1,
PAYED = 2,
CANCELED = 3,
CLOSED = 4,
}
//Record: 他会将一个类型的所有属性值都映射到另一个类型上并创造一个新的类型.
const orderStatusDesc: Record<orderStatusCode, string> = {
[orderStatusCode.UN_PAYED]: '未支付',
[orderStatusCode.PAYED]: '已支付',
[orderStatusCode.CANCELED]: '已取消',
[orderStatusCode.CLOSED]: '已关闭'
}
//打印结果为 订单状态: 未支付
console.log('订单状态:' + orderStatusDesc[orderStatus])7. any 任意类型 ¶
js
//任意数据类型
let data = 10;
data = 'hello';
data = {
id: 10,
name: '梁朝伟'
};
data = [1, 2, 3];//任意数据类型
let data = 10;
data = 'hello';
data = {
id: 10,
name: '梁朝伟'
};
data = [1, 2, 3];8. null 和 undefined ¶
js
//null与undefined 都是never(其他类型)的子类型
let num1:number
console.log(num1); //未赋值 报错
let num2:undefined
console.log(num2) //不报错 打印出num2
//一般这么应用，避免没有传值的时候报错
let num3:number | undefined
let num4:null
// num4 = 123 null不能赋值 报错
console.log(null); //不报错 打印出null//null与undefined 都是never(其他类型)的子类型
let num1:number
console.log(num1); //未赋值 报错
let num2:undefined
console.log(num2) //不报错 打印出num2
//一般这么应用，避免没有传值的时候报错
let num3:number | undefined
let num4:null
// num4 = 123 null不能赋值 报错
console.log(null); //不报错 打印出null9. void 类型 ¶
js
//void类型像是与any类型相反，它表示没有任何类型。 当一个函数没有返回值时，你通常会见到其返回值类型是 void
function warnUser(): void {
console.log('This is my warning message');
}
//void 类型只能为它赋予undefined和null
let unusable: void = undefined;
unusable = null;//void类型像是与any类型相反，它表示没有任何类型。 当一个函数没有返回值时，你通常会见到其返回值类型是 void
function warnUser(): void {
console.log('This is my warning message');
}
//void 类型只能为它赋予undefined和null
let unusable: void = undefined;
unusable = null;10. never 类型 ¶
js
// never类型表示的是那些永不存在的值的类型。 例如， never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型； 变量也可能是 never类型，当它们被永不为真的类型保护所约束时。
// never类型是任何类型的子类型，也可以赋值给任何类型；然而，没有类型是never的子类型或可以赋值给never类型（除了never本身之外）。 即使 any也不可以赋值给never。
// 下面是一些返回never类型的函数：
// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
throw new Error(message);
}
//推断的返回值类型为never
function fail() {
return error("Something failed");
}
//返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
while (true) {
}
}// never类型表示的是那些永不存在的值的类型。 例如， never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型； 变量也可能是 never类型，当它们被永不为真的类型保护所约束时。
// never类型是任何类型的子类型，也可以赋值给任何类型；然而，没有类型是never的子类型或可以赋值给never类型（除了never本身之外）。 即使 any也不可以赋值给never。
// 下面是一些返回never类型的函数：
// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
throw new Error(message);
}
//推断的返回值类型为never
function fail() {
return error("Something failed");
}
//返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
while (true) {
}
}类型断言 ¶
js
//类型断言有两种形式, 其一是'尖括号'语法.
let someValue: any = 'this is a string';
let strLength: number = (<string>someValue).length;
//另一个为as语法, 当你在TypeScript里使用JSX时, 只有 as语法断言是被允许的
let someValue: any = 'this is a string';
let strLength: number = (someValue as string).length;//类型断言有两种形式, 其一是'尖括号'语法.
let someValue: any = 'this is a string';
let strLength: number = (<string>someValue).length;
//另一个为as语法, 当你在TypeScript里使用JSX时, 只有 as语法断言是被允许的
let someValue: any = 'this is a string';
let strLength: number = (someValue as string).length;js
//js 例子
function getResult(a: string | number):number {
if (typeof(a) === 'string') {
return a.length;
} else {
return a.toString().length;
}
}
let b = getResult('hahahaha'); // 输出长度为8//js 例子
function getResult(a: string | number):number {
if (typeof(a) === 'string') {
return a.length;
} else {
return a.toString().length;
}
}
let b = getResult('hahahaha'); // 输出长度为8js
//ts 类型断言
function getResult(a: string | number):number {
if ((<string>a).length) {
// 切记：这里也需要加上类型断言
return (<string>a).length;
} else {
return a.toString().length;
}
}
let b = getResult('hahahaha'); // 长度为8//ts 类型断言
function getResult(a: string | number):number {
if ((<string>a).length) {
// 切记：这里也需要加上类型断言
return (<string>a).length;
} else {
return a.toString().length;
}
}
let b = getResult('hahahaha'); // 长度为8