基本使用
定义类型尽量优先inteface,type,至于两者有什么区别的话,是优先用inteface,不行再用type
定义的基本类型,都使用小写的,如number string boolean
泛型
内置工具
内置工具泛型巧用可以减少重复定义,如 ReturnType,Partial,Required,Omit,Pick
主要是在熟练的情况下,类似于ts的定义的方法处理一项任务
1. Partial
把定义的类型都转为非必填
interface People {
age: number;
List: string[];
name: string;
}
const val: Partial<People>;
// 等价于
interface People {
age?: number;
List?: string[];
name?: string;
}
2. Required
把定义的类型都转为必填
interface People {
age: number;
List?: string[];
name?: string;
}
const val: Required<People>;
// 等价于
interface Test {
age: number;
List: string[];
name: string;
}
3. Readonly
把定义的类型都转为只读
interface People {
age: number;
List: string[];
name: string;
}
const val: Readonly<Test>;
// 等价于
interface People {
readonly age: number;
readonly List: string[];
readonly name: string;
}
4. Pick
取出定义中的指定属性类型
interface People {
age: number;
List: string[];
name: string;
}
const val: Pick<People, "age" | "List">;
// 等价于
interface People {
age: number;
List: string[];
}
5. Record
转化为同一种类型,主要用于转化对象的参数相同结构的定义
const val: Record<"age" | "name", string>;
// 等价于
interface Test {
age: string;
name: string;
}
6. Exclude
排除目标的类型的 key(第一个参数为类型,第二参数为排除的属性类型)
interface People {
age: number;
List: string[];
name: string;
phone:number
}
const val: Exclude<keyof People, "age" | "List">;
// 等价于
"region" | "phone";
7. Extract
提取目标类型的 key,只会提取存在key的类型
interface People {
age: number;
List: string[];
name: string;
phone:number
}
const val: Extract<keyof People, "age" | "name" | "name666">;
// 等价于
"age" | "name";
8. Omit
过滤不需要的属性
interface People {
age: number;
List: string[];
name: string;
phone:number
}
const val: Omit<Test, "age">;
// 等价于
interface People {
List: string[];
name: string;
phone:number
}
9. NonNullable
值不能为 null 或 undefined
const val: NonNullable<undefined>;
// 等价于
const val: never;
- Parameters
获取函数的入参元组
function fn2(a: string[], b: number) {}
const val: Parameters<typeof fn2>;
// 等价于
const val: [string[], number];
11. ConstructorParameters
获取构造函数的入参元组
class Constructions {
constructor(a: string, b: number) {}
}
const val: ConstructorParameters<typeof Constructions>;
// 等价于
const val: [string, number];
12. ReturnType
获取函数的返回值类型
function fn1(a: string, b: number) {
return { a, b };
}
const val: ReturnType<typeof fn1>;
// 等价于
const val: {
a: string;
b: string;
};
符号
1. extends 约束或者条件类型 继承某个类型
如在左边时为约束
type People<T extends string> = {
[P in T]: string;
};
T 只能为 string 类型
如在右边时为条件
type People<T> = T extends string ? number : T;
// 如
const val: People<"abc">;
//等价于
const val: number;
T 属于 string,返回 never
2. keyof
获取定义的 key
interface People {
name: string;
phone:number
}
const val: keyof People;
// val: "phone"|"name"
3. typeof
获取某个值的定义,一般用于接口返回值不明确的情况下或者遍历map的item项
interface People {
age: number;
List: string[];
name: string;
phone:number
}
const val: People;
const a: typeof val;
// 获取到定义
interface People {
age: number;
List: string[];
name: string;
phone:number
}
4. in
遍历如 for...in
它遍历是这样结构的"a"|"b"|"c",这个相当于数组
type Test<T extends keyof string|number|symbol> = {
[P in T]: string;
};
// 如
const val: Test<"abc" | "bcd">;
//等价于
const val: { abc: string; bcd: string };
注意in只能遍历string|number|symbol
以上ts工具的用法在日常工作中已经够用了,欢迎评论区大佬补充