TypeScripe 笔记: 类型工具总结
admin
2024-03-16 11:43:11
0
TypeScripe 笔记: 类型工具总结

jcLee95 的CSDN博客
本文地址:https://blog.csdn.net/qq_28550263/article/details/128169632

目 录

1. 类型构造工具

  • Awaited
  • Partial
  • Required
  • Readonly
  • Record
  • Pick
  • Omit
  • Exclude
  • Extract
  • NonNullable
  • Parameters
  • ConstructorParameters
  • ReturnType
  • InstanceType
  • ThisParameterType
  • OmitThisParameter
  • ThisType

2. 字符串操作类型工具

  • 2.1 Uppercase
  • 2.2 Lowercase
  • 2.3 Capitalize
  • 2.4 Uncapitalize

1. 类型构造工具

类型工具描述
Awaited这种类型旨在对 async 函数中的 awaitPromises-specific 上的 .then() 方法等操作进行建模,特别是——它们以递归方式展开 promises
Partial构造一个 type 的所有属性都设置为可选的类型。该实用程序将返回一个表示给定类型的所有子集的类型。
Required构造由设置为 required 的所有类型属性组成的类型。Partial 的逆操作。
Readonly构造一个所有类型属性都设置为 readonly 的类型,这意味着不能重新分配构造类型的属性。
Record构造一个对象类型,其属性键是Keys,属性值是Type。该实用工具可用于将一种类型的属性映射到另一种类型。
Pick通过从类型中选取一组属性Keys(字符串或字符串的联合)来构造类型。
Omit通过从类型中选取所有属性,然后移除Keys(字符串文字或字符串文字的联合)来构造类型。
Exclude通过从UnionType中排除所有可分配给ExcludedMembers的联合成员来构造类型。
Extract通过从Type中提取可分配给 Union 的所有联合成员来构造类型。
NonNullable通过从 Type 中排除 nullundefined 来构造类型。
Parameters从函数类型 Type 的参数中使用的类型构造元组类型。
ConstructorParameters从构造函数类型的类型构造元组或数组类型。它产生一个包含所有参数类型的 tuple 类型(如果类型不是函数,则为 never 类型)。
ReturnType构造由函数类型的返回类型组成的类型。
InstanceType构造由类型中构造函数的实例类型组成的类型。
ThisParameterType提取函数类型的 this 参数的类型,如果函数类型没有 this 参数,则为 unknown
OmitThisParameter从 Type 中移除此参数。如果 Type 没有显式声明此参数,则结果只是 Type。否则,将从 Type 创建一个不带此参数的新函数类型。泛型被删除,只有最后一个重载签名被传播到新的函数类型中。
ThisType该实用工具不返回转换后的类型。相反,它充当上下文 this 类型的标记。请注意,要使用此实用程序,必须启用 noImplicitThis 标志。

1.1 Awaited

这种类型旨在对 async 函数中的 awaitPromises-specific 上的 .then() 方法等操作进行建模,特别是——它们以递归方式展开 promises

type A = Awaited>;            // type A = string
type B = Awaited>>;   // type B = number
type C = Awaited>;  // type C = number | boolean

1.2 Partial

构造一个 type 的所有属性都设置为可选的类型。该实用程序将返回一个表示给定类型的所有子集的类型。

interface Todo {title: string;description: string;
}function updateTodo(todo: Todo, fieldsToUpdate: Partial) {return { ...todo, ...fieldsToUpdate };
}const todo1 = {title: "organize desk",description: "clear clutter",
};const todo2 = updateTodo(todo1, {description: "throw out trash",
});

1.3 Required

构造由设置为 required 的所有类型属性组成的类型。Partial 的逆操作。

interface Props {a?: number;b?: string;
}
const obj: Props = { a: 5 };// 错误:类型 `{ a: number; }` 中缺少属性 `b`,但在类型 `Required` 中是必需的。
const obj2: Required = { a: 5 }; 

1.4 Readonly

构造一个所有类型属性都设置为 readonly 的类型,这意味着不能重新分配构造类型的属性。

interface Todo {title: string;
}
const todo: Readonly = {title: "Delete inactive users",
};// 错误:无法分配给 `title`,因为它是只读属性。
todo.title = "Hello";  

该工具对于表示将在运行时失败的赋值表达式非常有用(例如,当尝试重新分配冻结对象的属性时)。

1.5 Record

构造一个对象类型,其属性键是Keys,属性值是Type。该实用工具可用于将一种类型的属性映射到另一种类型。

interface CatInfo {age: number;breed: string;
}type CatName = "miffy" | "boris" | "mordred";const cats: Record = {miffy: { age: 10, breed: "Persian" },boris: { age: 5, breed: "Maine Coon" },mordred: { age: 16, breed: "British Shorthair" },
};// const cats: Record
cats.boris;

1.6 Pick

通过从类型中选取一组属性Keys(字符串或字符串的联合)来构造类型。

interface Todo {title: string;description: string;completed: boolean;
}type TodoPreview = Pick;const todo: TodoPreview = {title: "Clean room",completed: false,
};// const todo: TodoPreview
todo;

1.7 Omit

通过从类型中选取所有属性,然后移除Keys(字符串文字或字符串文字的联合)来构造类型。

interface Todo {title: string;description: string;completed: boolean;createdAt: number;
}type TodoPreview = Omit;const todo: TodoPreview = {title: "Clean room",completed: false,createdAt: 1615544252770,
};// const todo: TodoPreview
todo;
type TodoInfo = Omit;const todoInfo: TodoInfo = {title: "Pick up kids",description: "Kindergarten closes at 5pm",
};// const todoInfo: TodoInfo
todoInfo;

1.8 Exclude

通过从UnionType中排除所有可分配给ExcludedMembers的联合成员来构造类型。

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

1.9 Extract

通过从Type中提取可分配给 Union 的所有联合成员来构造类型。

type T0 = Extract<"a" | "b" | "c", "a" | "f">;                // type T0 = "a"
type T1 = Extract void), Function>;  // type T1 = () => void

1.10 NonNullable

通过从 Type 中排除 nullundefined 来构造类型。

type T0 = NonNullable;  // type T0 = string | number
type T1 = NonNullable;  // type T1 = string[]

1.11 Parameters

从函数类型 Type 的参数中使用的类型构造元组类型。

declare function f1(arg: { a: number; b: string }): void;type T0 = Parameters<() => string>;        // type T0 = []
type T1 = Parameters<(s: string) => void>; // type T1 = [s: string]
type T2 = Parameters<(arg: T) => T>;    // type T2 = [arg: unknown]
type T3 = Parameters;           // type T3 = [arg: { a: number; b: string;}]
type T4 = Parameters;                 // type T4 = unknown[]
type T5 = Parameters;               // type T5 = never// 类型 `string` 不满足约束`(...args: any) => any`。
type T6 = Parameters;              // type T6 = never// 类型 `Function` 不满足约束 `(...args: any) => any`。
// 类型 `Function` 没有为签名 `(...args: any): any`。
type T7 = Parameters;            // type T7 = never

1.12 ConstructorParameters

从构造函数类型的类型构造元组或数组类型。它产生一个包含所有参数类型的 tuple 类型(如果类型不是函数,则为 never 类型)。

type T0 = ConstructorParameters;     // type T0 = [message?: string]
type T1 = ConstructorParameters;  // type T1 = string[]
type T2 = ConstructorParameters;    // type T2 = [pattern: string | RegExp, flags?: string]
type T3 = ConstructorParameters;                  // type T3 = unknown[]// 类型 'Function' 不满足约束 `abstract new (...args: any) => any`.
// 类型 'Function' 没有为签名提供匹配项 `new (...args: any): any`.
type T4 = ConstructorParameters;             // type T4 = never

1.13 ReturnType

构造由函数类型的返回类型组成的类型。

declare function f1(): { a: number; b: string };type T0 = ReturnType<() => string>;        // type T0 = string
type T1 = ReturnType<(s: string) => void>; // type T1 = void
type T2 = ReturnType<() => T>;          // type T2 = unknown
type T3 = ReturnType<() => T>;  // type T3 = number[]
type T4 = ReturnType;           // type T4 = { a: number; b: string;}
type T5 = ReturnType;                 // type T5 = any
type T6 = ReturnType;               // type T6 = never// 类型 `string` does not satisfy the constraint '(...args: any) => any'.
type T7 = ReturnType;              // type T7 = any// 类型 `Function` 不满足约束 `(...args: any) => any`.
// 类型 `Function` 没有为签名提供匹配项 `(...args: any): any`.
type T8 = ReturnType;            // type T8 = any

1.14 InstanceType

构造由类型中构造函数的实例类型组成的类型。

class C {x = 0;y = 0;
}type T0 = InstanceType;  // type T0 = C
type T1 = InstanceType;       // type T1 = any
type T2 = InstanceType;     // type T2 = never// 类型 `string` 不满足约束 `abstract new (...args: any) => any`.
type T3 = InstanceType;    // type T3 = any// 类型 `Function` 不满足约束 `abstract new (...args: any) => any`.
// 类型 `Function` 没有为签名提供匹配项 `new (...args: any): any`.
type T4 = InstanceType;  // type T4 = any

1.15 ThisParameterType

提取函数类型的 this 参数的类型,如果函数类型没有 this 参数,则为 unknown

function toHex(this: Number) {return this.toString(16);
}function numberToString(n: ThisParameterType) {return toHex.apply(n);
}

1.16 OmitThisParameter

从 Type 中移除此参数。如果 Type 没有显式声明此参数,则结果只是 Type。否则,将从 Type 创建一个不带此参数的新函数类型。泛型被删除,只有最后一个重载签名被传播到新的函数类型中。

function toHex(this: Number) {return this.toString(16);
}const fiveToHex: OmitThisParameter = toHex.bind(5);console.log(fiveToHex());

1.17 ThisType

该实用工具不返回转换后的类型。相反,它充当上下文 this 类型的标记。

注意,要使用此实用程序,必须启用 noImplicitThis 标志。

type ObjectDescriptor = {data?: D;methods?: M & ThisType; // 方法中 `this` 的类型是 D & M
};function makeObject(desc: ObjectDescriptor): D & M {let data: object = desc.data || {};let methods: object = desc.methods || {};return { ...data, ...methods } as D & M;
}let obj = makeObject({data: { x: 0, y: 0 },methods: {moveBy(dx: number, dy: number) {this.x += dx; // 强类型化 thisthis.y += dy; // 强类型化 this},},
});obj.x = 10;
obj.y = 20;
obj.moveBy(5, 5);

2. 字符串操作类型工具

为了有助于字符串操作,TypeScript包含了一组可用于字符串操作的类型。这些类型内置于编译器中以提高性能,在TypeScript 附带的. d.ts文件中找不到。

类型工具描述
Uppercase将字符串中的每个字符转换为大写形式。
Lowercase将字符串中的每个字符转换为小写形式。
Capitalize将字符串中的第一个字符转换为等效的大写字符。
Uncapitalize将字符串中的第一个字符转换为小写的等效字符。

2.1 Uppercase

将字符串中的每个字符转换为大写形式。

type Greeting = "Hello, world";
type ShoutyGreeting = Uppercase;  // type ShoutyGreeting = "HELLO, WORLD"type ASCIICacheKey = `ID-${Uppercase}`;
type MainID = ASCIICacheKey<"my_app">;      // type MainID = "ID-MY_APP"

2.2 Lowercase

将字符串中的每个字符转换为小写形式。

type Greeting = "Hello, world";
type QuietGreeting = Lowercase;  // type QuietGreeting = "hello, world"type ASCIICacheKey = `id-${Lowercase}`;
type MainID = ASCIICacheKey<"MY_APP">;     // type MainID = "id-my_app"

2.3 Capitalize

将字符串中的第一个字符转换为等效的大写字符。

type LowercaseGreeting = "hello, world";
type Greeting = Capitalize;  // type Greeting = "Hello, world"

2.4 Uncapitalize

将字符串中的第一个字符转换为小写的等效字符。

type UppercaseGreeting = "HELLO WORLD";
type UncomfortableGreeting = Uncapitalize; // type UncomfortableGreeting = "hELLO WORLD"

相关内容

热门资讯

怎么解除订阅安卓系统,安卓系统... 你是不是也和我一样,手机里订阅了好多服务,结果现在想解除订阅,却一头雾水?别急,今天就来手把手教你如...
安卓系统停用怎么开启,轻松恢复... 亲爱的手机控们,你是否曾经遇到过安卓系统突然停用的情况,让你手忙脚乱,不知所措?别担心,今天就来教你...
安卓系统电池健康度,电池健康度... 你有没有发现,你的安卓手机最近是不是有点儿不给力了?电池续航能力大不如前,充电速度也慢了不少?别急,...
安卓系统按键怎么截图,安卓系统... 你是不是也和我一样,有时候想截个图分享给朋友,却发现安卓手机的截图功能有点神秘呢?别急,今天就来手把...
购票系统安卓源代码,架构设计与... 你有没有想过,那些我们每天离不开的购票系统,它们背后的秘密是什么呢?今天,就让我带你一探究竟,揭开购...
安卓手机系统后台测试,深度解析... 你有没有发现,你的安卓手机后台总是悄悄地忙碌着?别小看了这些后台程序,它们可是手机系统稳定运行的关键...
安卓系统重启的图标,解锁设备新... 手机突然重启,是不是心里有点慌?别急,今天就来和你聊聊安卓系统重启的图标,让你一眼就能认出它,再也不...
车载智慧屏安卓系统,智能出行新... 你有没有发现,现在的车载智慧屏越来越智能了?尤其是那些搭载了安卓系统的,简直就像是个移动的小电脑,不...
安卓系统连上网权限,解锁设备无... 你有没有发现,你的安卓手机里有些应用总是偷偷连上网?别小看这个小小的网络权限,它可是能影响你隐私、消...
安卓谷歌操作系统,探索安卓谷歌... 你知道吗?在智能手机的世界里,有一个操作系统可是无人不知、无人不晓,那就是安卓谷歌操作系统。它就像一...
安卓系统手写%怎样调出,具体实... 你有没有遇到过这种情况:在使用安卓手机的时候,突然想用手写输入法来记录一些灵感或者重要信息,可是怎么...
安卓手机重置 系统设置,轻松恢... 手机用久了是不是感觉卡顿得厉害?别急,今天就来教你怎么给安卓手机来个大变身——重置系统设置!想象你的...
win如何安装安卓系统,Win... 哇,你有没有想过,让你的Win系统也能玩转安卓应用?没错,就是那种在手机上轻松自如的安卓系统,现在也...
苹果qq和安卓系统,跨平台体验... 你有没有发现,现在手机市场上,苹果和安卓的较量可是越来越激烈了呢!咱们就来聊聊这个话题,看看苹果QQ...
显示最好的安卓系统,探索最新旗... 你有没有想过,为什么安卓系统那么受欢迎呢?它就像一个魔法盒子,里面装满了各种神奇的魔法。今天,就让我...
安卓app怎么降级系统,系统版... 你有没有发现,有时候安卓手机的系统更新后,新功能虽然炫酷,但老系统用起来更顺手呢?别急,今天就来教你...
雷军脱离安卓系统,引领科技变革... 你知道吗?最近科技圈可是炸开了锅,因为我们的雷军大大竟然宣布要脱离安卓系统,这可真是让人大跌眼镜啊!...
安卓系统自动开网络,安卓系统自... 你有没有发现,手机里的安卓系统有时候会自动开启网络连接,这可真是让人又爱又恨啊!有时候,你正专心致志...
安卓系统怎样控制后台,因为服务... 手机里的安卓系统是不是感觉越来越卡了?后台程序太多,不仅耗电还影响性能。别急,今天就来教你怎么巧妙地...
安卓系统打游戏推荐,一触即达! 你有没有发现,现在手机游戏越来越好玩了?不管是休闲小游戏还是大型MMORPG,都能在手机上畅玩。但是...