ts学习记录1--类型
# ts学习记录1--类型
[TOC]
# JavaScript
有的八个类型
# 1. 布尔类型
只能是true或false
let bool: boolean = false;
bool = true;
bool = 123; // error 不能将类型“123”分配给boolean
let bool2: boolean = !!0 // 赋值的值可以是计算之后的布尔值的表达式
console.log(bool2) // false
2
3
4
5
# 2. 数字类型
同JavaScript,所有数字都是浮点数,所以只有number类型没有int或float类型,
TypeScript
还支持ES6
中新增的二进制和八进制数字字面量,所以TypeScript
中共支持二、八、十和十六四种进制的数值
定义:
let num: number;
num = 123;
num = "123"; // error 不能将“123”分配给类型“number”
num = 0b1111011; // 二进制的123
num = 0o173; // 八进制的123
num = 0x7b; // 十六进制的123
const num1 = 321; // 如果没指定类型赋值数字,编译器会推断类型
2
3
4
5
6
7
注意:
number
和Number
的区别:Number
是javascript
的原生类型,用其创建数值类型的值
# 3. 字符串
let str: string = 'carmineprince'
str = 'prince'
2
# 4. 数组
Array<type> 或 type[]
推荐type[]
let list1: number[] = [1, 2, 3] // 推荐使用这种写法
let list2: Array<number> = [1, 2, 3]
2
# 5. null和undefined
在
JavaScript
中,undefined和null是两个基本数据类型在
TypeScript
中,两者都以后各自的类型即undefined
和null
他们即是实际的值,也是类型
let u: undefined = undefined
let n: null = null
2
默认情况下undefined
和null
可以赋值给任意类型的值
# 6. object
object在js中是引用类型,object类型的变量存的是引用
let strInit = "abc";
let strClone = strInit;
strClone = "efg";
console.log(strInit); // 'abc'
let objInit = { a: "aa" };
let objClone = objInit;
console.log(objClone) // {a:"aa"}
objInit.a = "bb";
console.log(objClone); // { a: 'bb' }
2
3
4
5
6
7
8
9
# 7. symbol
# TypeScript
补充的六个类型
# 1. 元组
数组的拓展
表示已知元素数量和类型的数组
已知数组中每一个位置上的元素的类型
let tuple: [string, number, boolean];
tuple = ["a", 2, false];
tuple = [2, "a", false]; // error 不能将类型 “number” 分配给类型 “string” 。 不能将类型 “string” 分配给类型 “number” 。
tuple = ["a", 2]; // error Property '2' is missing in type '[string, number]' but required in type '[string, number, boolean]'
tuple[1] = 3; // 单个元素赋值
2
3
4
5
6
# 2. 枚举
默认:
enum Roles {
SUPER_ADMIN, // 0
ADMIN, // 1
USER // 2
}
2
3
4
5
定义开始:
enum Roles {
SUPER_ADMIN = 1, // 1
ADMIN, // 2
USER // 3
}
2
3
4
5
自定义:
enum Roles {
SUPER_ADMIN = 1,
ADMIN = 3,
USER = 7
}
2
3
4
5
获取枚举值:
enum Roles {
SUPER_ADMIN, // 0
ADMIN, // 1
USER // 2
}
console.log(Roles.SUPER_ADMIN) // 0
console.log(Roles[0]) // 'ADMIN'
2
3
4
5
6
7
# 3. Any
JavaScript 的类型是灵活的,程序有时也是多变的。有时,我们在编写代码的时候,并不能清楚地知道一个值到底是什么类型,这时就需要用到 any 类型
let value: any;
value = 123;
value = "abc";
value = false;
2
3
4
不要滥用 any ,如果任何值都指定为 any 类型,那么 TypeScript 将失去它的意义
# 4. void
void 和 any 相反, any 是表示任意类型,而 void 是表示没有任意类型,就是什么类型都不是,这在我们定义函数,函数没有返回值时会用到
const consoleTest = (text: string): void => {
console.log(text);
}
2
3
void
类型的变量只能赋值为 undefined
和 null
, 其他类型不能赋值给 void 类型的变量。
# 5. never
never 类型指那些永不存在的值的类型,它是那些总会抛出异常或根本不会有返回值的函数表达式的返回值类型,当变量被永不为真的类型保护(后面章节会详细介绍)所约束时,该变量也是 never 类型。
const errorFunc = (message: string): never => {
throw new Error(message);
};
2
3
# 与void的区别
通常情况下我们会这样定义无返回值的函数:
const fun = (): void => {}
但在TypeScript
中void
至少包含了一下几个子类型:
- undefined
- null
# 完全无返回值
而never是完全没有返回值的类型,只有一种情况会如此:代码阻断
满足的条件:
throw new Error
return process.exit(1)
while(true){}
如果函数的返回值类型是 never
意味的此函数必须不能被顺利完整执行,而发生中断行为。
# 所有类型的子类型
never 是所有类型的子类型,因此可以理解为:所有的函数的返回值都包含 never 类型:
function fun(s: string): number {
if (s == 'a') return 1;
if (s == 'b') return 2;
throw new Error;
}
// 等同于 fun(s: string): number | never
2
3
4
5
6
# 6. unknow
- 3.0版本新增
- 表示未知的类型
# 与any的区别
当指定了any类型以后,这个值基本上是“废了”,可以随意对其进行属性方法访问,不管有的还是没有的。
当指定了unknown类型以后,如果没有通过基于控制流的类型断言来缩小范围的话,是不能对他进行任何操作的。
# 关于类型的拓展内容
# 1. 交叉类型
交叉类型就是取多个类型的并集,使用 & 符号定义,被 & 符链接的多个类型构成一个交叉类型,表示这个类型同时 具备这几个连接起来的类型的特点,来看例子:
const merge = <T, U>(arg1: T, arg2: U): T & U => {
let res = <T & U>{}; // 这里指定返回值的类型兼备 T 和 U 两个类型变量代表的类型的特点
res = Object.assign(arg1, arg2); // 这里使用 Object.assign 方法,返回一个合并后的对象;
return res;
};
const info1 = {
name: "lison"
};
const info2 = {
age: 18
};
const lisonInfo = merge(info1, info2);
console.log(lisonInfo.address); // error 类型 “{ name: string; } & { age: number; }” 上不存在属性 “address”
2
3
4
5
6
7
8
9
10
11
12
13
# 2. 联合类型
联合类型是要求只要符合联合类型中任意一种类型即可,它使用 | 符号定义。当我们的程序具有多样性,元素类型不唯一时,即使用联合类型。
const getLength = (content: string | number): number => {
if (typeof content === "string") return content.length;
else return content.toString().length;
};
console.log(getLength("abc")); // 3
console.log(getLength(123)); // 3
2
3
4
5
6