TypeScript实用工具类型

最新推荐文章于 2024-10-26 09:46:47 发布

原创最新推荐文章于 2024-10-26 09:46:47 发布 · 294 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#typescript #javascript

文章介绍了TypeScript中的六种类型操作符：Partial用于使所有属性变为可选，Required则相反，强制属性为必需；Pick从类型中选择指定属性，Omit移除指定属性；Exclude从联合类型中排除指定类型，Readonly将属性设置为只读；Record则用于创建基于键值对的类型。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

分享几种实用的工具类型，分别是：Partial、Required、Pick、Omit、Exclude、Readonly、Record

Partial

生成一个新的类型，所有属性与原类型的属性相同，但都为可选项

interface IUser1 {
  name: string;
  age: number;
  gender: number;
}
type IUser2 = Partail<IUser1>

相当于
interface IUser2 {
  name?: string;
  age?: number;
  gender?: number;
}

原理
type Partial<T> = {
  [P in keyof T]?: T[P];
};

Required

与Partial相反，生成的新数组，所有属性与原属性相同，都是必选项

interface IUser1 {
  name: string;
  age?: number;
  gender?: number;
}
type IUser2 = Required<IUser1>

相当于
interface IUser2 {
  name: string;
  age: number;
  gender: number;
}

Pick

从类型A中挑出一些属性，生成类型B

interface A {
	name: string;
	age: number;
	gender: number;
}
type B = Pick<A, 'name' | 'age'>

等同于
interface B {
	name: string;
	age: number;
}
原理
type Pick<T, K extends keyof T> = {
    [P in K]: T[P];
};

Omit

类型A中除了指定属性之外的所有属性，生成一个新类型

interface A {
	name: string;
	age: number;
	gender: number;
}
type B = Omit<A, 'gender'>

等同于
interface B {
	name: string;
	age: number;
}
原理
type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;

Exclude

将类型A中属于类型B的属性移除掉

type T0 = Exclude<"a" | "b" | "c", "a">; // "b" | "c"
type T1 = Exclude<"a" | "b" | "c", "a" | "b">; // "c"
type T2 = Exclude<string | number | (() => void), Function>; // string | number

原理
type Exclude<T, U> = T extends U ? never : T;

Readonly

将某个类型的所有属性都变成只读属性，意味着这些属性不能被重新赋值

interface Todo {
 title: string;
}
 
const todo: Readonly<Todo> = {
 title: "Delete inactive users"
};
 
todo.title = "Hello"; 
// Error: cannot reassign a readonly property 

原理
type Readonly<T> = {
 readonly [P in keyof T]: T[P];
};

Record

将类型A的所有属性转变成类型B

type A = 'home' | 'about' | 'content';

interface B {
	titile: string
}

const x: Record<A,B> = {
	about: { title: "about" },
	contact: { title: "contact" },
	home: { title: "home" },
}

原理
type Record<K extends keyof any, T> = {
    [P in K]: T;
};