diff --git a/dist/index.html b/dist/index.html
index 9daa09e..2575d2d 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -1 +1 @@
-REACT-ADMIN
\ No newline at end of file
+REACT-ADMIN
\ No newline at end of file
diff --git a/src/views/MyPlayGround/TsApply/UtilityTypes.ts b/src/views/MyPlayGround/TsApply/UtilityTypes.ts
new file mode 100644
index 0000000..dcb6c92
--- /dev/null
+++ b/src/views/MyPlayGround/TsApply/UtilityTypes.ts
@@ -0,0 +1,272 @@
+/* eslint-disable @typescript-eslint/ban-types */
+export default {};
+// TypeScript
+
+/* 1. Awaited 是一个用于获取 Promise 或异步函数返回值的类型工具; 接受一个类型参数 T，它可以是一个 Promise 类型或异步函数类型。它会返回 T 类型中所包含的 Promise 解析后的值的类型。 */
+type Aa = Awaited>;
+// type Aa = string
+
+type Ab = Awaited>>;
+// type A = string
+
+type Ac = Awaited;
+// type Ac = boolean
+
+type Ad = Awaited>;
+// type Ad = string | boolean
+
+async function fetchData(): Promise<{ name: string; age: number }> {
+ return new Promise(resolve => {
+ setTimeout(() => {
+ resolve({ name: "aaaa", age: 123 });
+ });
+ });
+}
+
+type Ae = Awaited>;
+// type Ae = {
+// name: string;
+// age: number;
+// }
+
+/* 手动实现一个Awaited */
+type MyAwaited = T extends Promise ? R : T;
+type MyAa = MyAwaited>;
+// type MyAa = string
+
+type MyAb = MyAwaited>>;
+// type MyAb = string
+
+type MyAc = MyAwaited;
+// type MyAc = boolean
+
+type MyAd = MyAwaited>;
+// type MyAd = string | boolean
+
+async function myFetchData(): Promise<{ name: string; age: number }> {
+ return new Promise(resolve => {
+ setTimeout(() => {
+ resolve({ name: "aaaa", age: 123 });
+ });
+ });
+}
+
+type MyAe = MyAwaited>;
+// type MyAe = {
+// name: string;
+// age: number;
+// }
+
+/* 2. Partial 是一个用于将对象类型的所有属性设置为可选的类型工具; 接受一个类型参数 T，它可以是一个对象类型。它会返回一个新的类型，该类型与 T 相同，但所有属性都被标记为可选。 */
+interface Pa {
+ title: string;
+ description: string;
+}
+
+function pUpdatePa(todo: Pa, fieldsToUpdate: Partial) {
+ return { ...todo, ...fieldsToUpdate };
+}
+
+const pTodo1: Pa = {
+ title: "organize desk",
+ description: "clear clutter",
+};
+
+const pTodo2 = pUpdatePa(pTodo1, { description: "throw out trash" });
+
+// 手动实现一个Partial
+type MyPartial = {
+ [K in keyof T]?: T[K]; // "key"of 重点在key,主要是编辑对象所有的属性,并以联合类型返回,而in操作符则是用来遍历联合类型的,两个刚好可以配合使用
+};
+
+/* 3. Required 构建一个类型，其中包含将 Type 的所有属性设置为 required。与 Partial 相反。 */
+interface RProps {
+ a?: number;
+ b?: number;
+}
+const rObj: RProps = { a: 5 };
+
+// const rObj2: Required = { a: 5 }; //报错 类型 "{ a: number; }" 中缺少属性 "b"，但类型 "Required" 中需要该属性。
+
+// 手动实现一个 Required
+type MyRequired = {
+ [K in keyof T]-?: T[K];
+};
+
+/* 4. Readonly 构建一个类型，其中所有的属性都设置为只读（readonly），意味着构建的类型的属性不能被重新赋值。 */
+interface ROTodo {
+ title: string;
+}
+const roTodo: Readonly = {
+ title: "is object freeze",
+};
+
+// roTodo.title = "222"; //报错 无法为“title”赋值，因为它是只读属性。
+
+// Object.freeze;
+// function freeze(obj: Type): Readonly;
+
+// 手动实现一个 Readonly
+type MyReadonly = {
+ readonly [K in keyof T]: T[K];
+};
+
+/* 5. Record 用于创建一个类型，该类型将指定的键映射到特定的值类型。它的作用是创建一个具有指定键和值类型的对象类型。 */
+interface RecordCatInfo {
+ age: number;
+ bread: string;
+}
+type RecordCatName = "miffy" | "boris" | "moddred"; //type可以声明basic type 和 union type ,interface只能声明对象或者函数
+
+const cats: Record = {
+ miffy: { age: 23, bread: "my" },
+ boris: { age: 122, bread: "mi" },
+ moddred: { age: 253, bread: "ffy" },
+};
+// 手动实现 MyRecord
+type MyRecord = {
+ [P in K]: T;
+};
+
+/* 6.Pick 用于从给定类型中选择指定属性，创建一个新的类型。这可以用于从一个较大的类型中提取出我们所需的属性，以便在其他地方使用。 */
+interface PickPerson {
+ name: string;
+ age: number;
+ address: string;
+ email: string;
+}
+
+type PickPersonInfo = Pick;
+// type PickPersonInfo = {
+// name: string;
+// age: number;
+// }
+const pickPersonInfo: PickPersonInfo = {
+ name: "lihua",
+ age: 28,
+};
+// 手动实现 Pick
+type MyPick = {
+ [P in K]: T[P];
+};
+type MyPickPersonInfo = MyPick;
+const myPickPersonInfo: PickPersonInfo = {
+ name: "lihua",
+ age: 28,
+};
+
+// extends的三种作用TS中 : 1. 类型继承;2. 类型约束;3. 条件类型,类似于三元运算符
+
+/* 7. Omit 通过从Type中选择所有属性，然后移除Keys（字符串字面量或字符串字面量的联合），构建一个类型。与Pick相反。 */
+interface OmitPerson {
+ name: string;
+ age: number;
+ address: string;
+ email: `${string}@${string}.com`;
+}
+
+type OmitPersonInfo = Omit;
+const omitPersonInfo: OmitPersonInfo = {
+ address: "lihua",
+ email: "xxx@163.com",
+};
+type MyOmit = {
+ [P in keyof T as P extends K ? never : P]: T[P];
+};
+type MyOmitPersonInfo = Omit;
+const myOmitPersonInfo: MyOmitPersonInfo = {
+ address: "lihua",
+ email: "xxx@163.com",
+};
+
+/* 8. Exclude 通过从UnionType中排除所有可分配给ExcludedMembers的联合成员，构建一个类型。 */
+type ExT0 = Exclude<"a" | "b" | "c", "a">;
+// type ExT0 = "b" | "c"
+
+type ExT1 = Exclude<"a" | "b" | "c", "a" | "c">;
+// type ExT1 = "b"
+
+type ExT2 = Exclude void), Function>;
+// type ExT2 = string | number
+
+// 以 | 开头的方式，我们可以更直观地理解这是一个联合类型，提供了多个可能的类型选项。这种写法使代码更易读、更易理解。
+type ExShape =
+ | { kind: "circle"; radius: number }
+ | { kind: "square"; x: number }
+ | { kind: "triangle"; x: number; y: number };
+
+type ExT3 = Exclude;
+// type ExT3 = {
+// kind: "square";
+// x: number;
+// } | {
+// kind: "triangle";
+// x: number;
+// y: number;
+// }
+
+// 手动实现一个Exclude
+type MyExclude = T extends U ? never : T;
+type ExT4 = MyExclude;
+// type ExT4 = {
+// kind: "square";
+// x: number;
+// } | {
+// kind: "triangle";
+// x: number;
+// y: number;
+// }
+
+/* 9. Extract 用于从联合类型 T 中提取可以赋值给类型 U 的成员类型, 其实就是公共类型,两种类型的交集 */
+type ET0 = Extract<"a" | "b" | "c", "a" | "f">;
+// type ET0 = "a"
+type ET1 = Extract void), Function>;
+// type ET1 = () => void
+
+type EShape =
+ | { kind: "circle"; radius: number }
+ | { kind: "square"; x: number }
+ | { kind: "triangle"; x: number; y: number };
+type ET2 = Extract; // never
+type ET3 = Extract;
+// type ET3 = {
+// kind: "circle";
+// radius: number;
+// };
+type MyExtract = T extends U ? T : never;
+
+/* 10.NonNullable 从类型中排除掉 null 和 undefined，并构建一个新的类型。 */
+type NonN0 = NonNullable;
+// type NonN0 = string | number
+type NonN1 = NonNullable<{ a: undefined } | undefined>;
+// type NonN1 = {
+// a: undefined;
+// };
+
+/* 11. Parameters 从函数类型 T 中提取其参数类型的**元组**类型;对于重载函数，这将是最后一个签名的参数；请参阅在条件类型中进行类型推断。 */
+declare function pF1(arg: { a: number; b: string }): void;
+type PT0 = Parameters<() => string>;
+// type PT0 = []
+
+type PT1 = Parameters<(str: string) => void>;
+// type PT1 = [str: string]
+
+type PT2 = Parameters<(arg: T) => T>;
+// type PT1 = [str: string]
+
+type TP3 = Parameters;
+// type TP3 = [arg: {
+// a: number;
+// b: string;
+// }]
+type TP4 = Parameters;
+// type TP4 = unknown[]
+
+type TP5 = Parameters;
+// type TP5 = never
+
+// type TP6 = Parameters;
+// 报错: 类型“Function”不满足约束“(...args: any) => any”。
+// 类型“Function”提供的内容与签名“(...args: any): any”不匹配。
+
+/* 12. ConstructorParameters */