高级类型
高级类型是指 TypeScript 语言的一些高级特性,可以帮助我们更好地使用类型系统。
交叉类型 (&)
typescript
type Person = { name: string; age: number };
type Worker = { salary: number; isEmployed: boolean };
type PersonAndWorker = Person & Worker;
const personAndWorker: PersonAndWorker = {
name: 'Alice',
age: 25,
salary: 50000,
isEmployed: true
};联合类型 (|)
typescript
type PersonOrWorker = Person | Worker;
const personOrWorker: PersonOrWorker = {
name: 'Bob',
age: 30,
salary: 60000,
isEmployed: false
};类型别名 (type)
typescript
type Name = string;
type Age = number;
type Person = { name: Name; age: Age };
const person: Person = {
name: 'Charlie',
age: 35
};字符串字面量类型
typescript
type Name = 'Alice' | 'Bob' | 'Charlie';
type Age = 25 | 30 | 35;
type Person = { name: Name; age: Age };
const person: Person = {
name: 'Charlie',
age: 35
};数字字面量类型
typescript
type Age = 25 | 30 | 35;
type Person = { name: string; age: Age };
const person: Person = {
name: 'Charlie',
age: 35
};索引类型 (keyof)
typescript
interface Person {
name: string;
age: number;
[key: string]: any;
}
type PersonKeys = keyof Person; // "name" | "age" | string映射类型 (in)
typescript
type PartialPerson = { [P in keyof Person]?: Person[P] };
const partialPerson: PartialPerson = {
name: 'Alice'
};条件类型 (extends)
typescript
type IsString<T> = T extends string ? true : false;
type IsNumber<T> = T extends number ? true : false;
type A = IsString<string>; // true
type B = IsString<number>; // false
type C = IsNumber<string>; // false
type D = IsNumber<number>; // true类型保护 (typeof)
typescript
function isString(value: any): value is string {
return typeof value === "string";
}
function isNumber(value: any): value is number {
return typeof value === "number";
}
function logValue(value: string | number) {
if (isString(value)) {
console.log(value.toUpperCase());
} else if (isNumber(value)) {
console.log(value.toFixed(2));
} else {
console.log(value);
}
}
logValue("hello"); // HELLO
logValue(123); // 123.00
logValue(true); // true (not covered by any type guard)类型断言 (as)
typescript
const person: any = {
name: 'Alice',
age: 25
};
const name = (person as { name: string }).name;
const age = (person as { age: number }).age;类型别名、接口、断言的区别
- 类型别名可以给一个类型起一个新的名字,可以用来表示一个类型,可以与其他类型进行交互;
- 接口可以用来描述一个对象的形状,可以包含属性、方法、构造函数等,不能用来表示一个类型,只能用来描述一个对象。
- 类型断言可以用来告诉编译器,一个变量的类型是某种类型,但是编译器并不知道这个变量的具体类型。
