本地集团网站建设,咨询公司排行榜,专注wordpress开发,网站推广建议类型工具
是ts提供的一些内置的工具#xff0c;用来更方便地处理各种类型#xff0c;以及生成新的类型#xff0c;可以直接使用。也就是对类型的操作。
1. 字符串类型工具
ts 内置了四个字符串类型工具#xff0c;专门用来操作字符串类型。这四个工具类型都定义在 ts 自…类型工具
是ts提供的一些内置的工具用来更方便地处理各种类型以及生成新的类型可以直接使用。也就是对类型的操作。
1. 字符串类型工具
ts 内置了四个字符串类型工具专门用来操作字符串类型。这四个工具类型都定义在 ts 自带的.d.ts文件里面。
它们的实现都是在底层调用 JavaScript 引擎提供 JavaScript 字符操作方法。 1. UppercaseStringType
UppercaseStringType将字符串类型的每个字符转为大写。
type A hello;
// HELLO
type B UppercaseA;2. LowercaseStringType
LowercaseStringType将字符串的每个字符转为小写。
type A HELLO;
// hello
type B LowercaseA;3. CapitalizeStringType
CapitalizeStringType将字符串的第一个字符转为大写。
type A hello;// Hello
type B CapitalizeA;4. UncapitalizeStringType
UncapitalizeStringType 将字符串的第一个字符转为小写。
type A HELLO;// hELLO
type B UncapitalizeA;2. AwaitedType
AwaitedType用来取出 Promise 的返回值类型适合用在描述then()方法和 await 命令的参数类型。
// string
type A AwaitedPromisestring;
上面示例中AwaitedType会返回 Promise 的返回值类型string。
它也可以返回多重 Promise 的返回值类型。
// number
type B AwaitedPromisePromisenumber;
如果它的类型参数不是 Promise 类型那么就会原样返回。
// number | boolean
type C Awaitedboolean | Promisenumber;
上面示例中类型参数是一个联合类型其中的boolean会原样返回所以最终返回的是number|boolean。
AwaitedType的实现如下。
type AwaitedT T extends null | undefined ? T :T extends object {then(onfulfilled: infer F,...args: infer _): any;} ? F extends (value: infer V,...args: infer _) any ? Awaited... : never:T;
3. ConstructorParametersType
ConstructorParametersType提取构造方法Type的参数类型组成一个元组类型返回。
type T1 ConstructorParametersnew (x: string, y: number) object
; // [x: string, y: number]type T2 ConstructorParametersnew (x?: string) object
; // [x?: string | undefined]
它可以返回一些内置构造方法的参数类型。
type T1 ConstructorParametersErrorConstructor
; // [message?: string]type T2 ConstructorParametersFunctionConstructor
; // string[]type T3 ConstructorParametersRegExpConstructor
; // [pattern:string|RegExp, flags?:string]
如果参数类型不是构造方法就会报错。
type T1 ConstructorParametersstring; // 报错type T2 ConstructorParametersFunction; // 报错
any类型和never类型是两个特殊值分别返回unknown[]和never。
type T1 ConstructorParametersany; // unknown[]type T2 ConstructorParametersnever; // never
ConstructorParametersType的实现如下。
type ConstructorParametersT extends abstract new (...args: any) anyT extends abstract new (...args: infer P) any ? P : never
4. ExcludeUnionType, ExcludedMembers
ExcludeUnionType, ExcludedMembers用来从联合类型UnionType里面删除某些类型ExcludedMembers组成一个新的类型返回。
type T1 Excludea|b|c, a; // b|c
type T2 Excludea|b|c, a|b; // c
type T3 Excludestring|(() void), Function; // string
type T4 Excludestring | string[], any[]; // string
type T5 Exclude(() void) | null, Function; // null
type T6 Exclude200 | 400, 200 | 201; // 400
type T7 Excludenumber, boolean; // number
ExcludeUnionType, ExcludedMembers的实现如下。
type ExcludeT, U T extends U ? never : T;
上面代码中等号右边的部分表示先判断T是否兼容U如果是的就返回never类型否则返回当前类型T。由于never类型是任何其他类型的子类型它跟其他类型组成联合类型时可以直接将never类型从联合类型中“消掉”因此ExcludeT, U就相当于删除兼容的类型剩下不兼容的类型。 5. ExtractType, Union
ExtractUnionType, Union用来从联合类型UnionType之中提取指定类型Union组成一个新类型返回。它与ExcludeT, U正好相反。
type T1 Extracta|b|c, a; // a
type T2 Extracta|b|c, a|b; // a|b
type T3 Extracta|b|c, a|d; // a
type T4 Extractstring | string[], any[]; // string[]
type T5 Extract(() void) | null, Function; // () void
type T6 Extract200 | 400, 200 | 201; // 200
如果参数类型Union不包含在联合类型UnionType之中则返回never类型。
type T Extractstring|number, boolean; // never
ExtractUnionType, Union的实现如下。
type ExtractT, U T extends U ? T : never; 6. InstanceTypeType
InstanceTypeType提取构造函数的返回值的类型即实例类型参数Type是一个构造函数等同于构造函数的ReturnTypeType。
type T InstanceTypenew () object
; // object
上面示例中类型参数是一个构造函数new () object返回值是该构造函数的实例类型object。
下面是一些例子。
type A InstanceTypeErrorConstructor; // Error
type B InstanceTypeFunctionConstructor; // Function
type C InstanceTypeRegExpConstructor; // RegExp
上面示例中InstanceTypeT的参数都是 TypeScript 内置的原生对象的构造函数类型InstanceTypeT的返回值就是这些构造函数的实例类型。
由于 Class 作为类型代表实例类型。要获取它的构造方法必须把它当成值然后用typeof运算符获取它的构造方法类型。
class C {x 0;y 0;
}type T InstanceTypetypeof C; // C
上面示例中typeof C是C的构造方法类型然后 InstanceType 就能获得实例类型即C本身。
如果类型参数不是构造方法就会报错。
type T1 InstanceTypestring; // 报错type T2 InstanceTypeFunction; // 报错
如果类型参数是any或never两个特殊值分别返回any和never。
type T1 InstanceTypeany; // anytype T2 InstanceTypenever; // never
InstanceTypeType的实现如下。
type InstanceTypeT extends abstract new (...args:any) anyT extends abstract new (...args: any) infer R ? R :any;
7. NonNullableType
NonNullableType用来从联合类型Type删除null类型和undefined类型组成一个新类型返回也就是返回Type的非空类型版本。
// string|number
type T1 NonNullablestring|number|undefined;// string[]
type T2 NonNullablestring[]|null|undefined;type T3 NonNullableboolean; // boolean
type T4 NonNullablenumber|null; // number
type T5 NonNullablestring|undefined; // string
type T6 NonNullablenull|undefined; // never
NonNullableType的实现如下。
type NonNullableT T {}
上面代码中T {}等同于求T Object的交叉类型。由于 TypeScript 的非空值都属于Object的子类型所以会返回自身而null和undefined不属于Object会返回never类型。
8. OmitType, Keys
OmitType, Keys用来从对象类型Type中删除指定的属性Keys组成一个新的对象类型返回。
interface A {x: number;y: number;
}type T1 OmitA, x; // { y: number }
type T2 OmitA, y; // { x: number }
type T3 OmitA, x | y; // { }
上面示例中OmitType, Keys从对象类型A里面删除指定属性返回剩下的属性。
指定删除的键名Keys可以是对象类型Type中不存在的属性但必须兼容string|number|symbol。
interface A {x: number;y: number;
}type T OmitA, z; // { x: number; y: number }
上面示例中对象类型A中不存在属性z所以就原样返回了。
OmitType, Keys的实现如下。
type OmitT, K extends keyof any PickT, Excludekeyof T, K; 9. OmitThisParameterType
OmitThisParameterType从函数类型中移除 this 参数。
function toHex(this: Number) {return this.toString(16);
}type T OmitThisParametertypeof toHex; // () string
上面示例中OmitThisParameterT给出了函数toHex()的类型并将其中的this参数删除。
如果函数没有 this 参数则返回原始函数类型。
OmitThisParameterType的实现如下。
type OmitThisParameterT unknown extends ThisParameterTypeT ? T :T extends (...args: infer A) infer R ?(...args: A) R : T; 10. ParametersType
ParametersType从函数类型Type里面提取参数类型组成一个元组返回。
type T1 Parameters() string; // []type T2 Parameters(s:string) void; // [s:string]type T3 ParametersT(arg: T) T; // [arg: unknown]type T4 Parameters(x:{ a: number; b: string }) void
; // [x: { a: number, b: string }]type T5 Parameters(a:number, b:number) number
; // [a:number, b:number]
上面示例中ParametersType的返回值会包括函数的参数名这一点需要注意。
如果参数类型Type不是带有参数的函数形式会报错。
// 报错
type T1 Parametersstring;// 报错
type T2 ParametersFunction;
由于any和never是两个特殊值会返回unknown[]和never。
type T1 Parametersany; // unknown[]type T2 Parametersnever; // never
ParametersType主要用于从外部模块提供的函数类型中获取参数类型。
interface SecretName {first: string;last: string;
}interface SecretSanta {name: SecretName;gift: string;
}export function getGift(name: SecretName,gift: string
): SecretSanta {// ...
}
上面示例中模块只输出了函数getGift()没有输出参数SecretName和返回值SecretSanta。这时就可以通过ParametersT和ReturnTypeT拿到这两个接口类型。
type ParaT Parameterstypeof getGift[0]; // SecretNametype ReturnT ReturnTypetypeof getGift; // SecretSanta
ParametersType的实现如下。
type ParametersT extends (...args: any) any T extends (...args: infer P) any ? P : never 11. PartialType
PartialType返回一个新类型将参数类型Type的所有属性变为可选属性。
interface A {x: number;y: number;
}type T PartialA; // { x?: number; y?: number; }
PartialType的实现如下。
type PartialT {[P in keyof T]?: T[P];
}; 12. PickType, Keys
PickType, Keys返回一个新的对象类型第一个参数Type是一个对象类型第二个参数Keys是Type里面被选定的键名。
interface A {x: number;y: number;
}type T1 PickA, x; // { x: number }
type T2 PickA, y; // { y: number }
type T3 PickA, x|y; // { x: number; y: number }
上面示例中PickType, Keys会从对象类型A里面挑出指定的键名组成一个新的对象类型。
指定的键名Keys必须是对象键名Type里面已经存在的键名否则会报错。
interface A {x: number;y: number;
}type T PickA, z; // 报错
上面示例中对象类型A不存在键名z所以报错了。
PickType, Keys的实现如下。
type PickT, K extends keyof T {[P in K]: T[P];
};
13. ReadonlyType
ReadonlyType返回一个新类型将参数类型Type的所有属性变为只读属性。
interface A {x: number;y?: number;
}// { readonly x: number; readonly y?: number; }
type T ReadonlyA;
上面示例中y是可选属性ReadonlyType不会改变这一点只会让y变成只读。
ReadonlyType的实现如下。
type ReadonlyT {readonly [P in keyof T]: T[P];
};
我们可以自定义类型工具MutableType将参数类型的所有属性变成可变属性。
type MutableT {-readonly [P in keyof T]: T[P];
};
上面代码中-readonly表示去除属性的只读标志。
相应地readonly就表示增加只读标志等同于readonly。因此ReadOnlyType的实现也可以写成下面这样。
type ReadonlyT {readonly [P in keyof T]: T[P];
};
ReadonlyType可以与PartialType结合使用将所有属性变成只读的可选属性。
interface Person {name: string;age: number;
}const worker: ReadonlyPartialPerson { name: 张三 };worker.name 李四; // 报错 14. RecordKeys, Type
RecordKeys, Type返回一个对象类型参数Keys用作键名参数Type用作键值类型。
// { a: number }
type T Recorda, number;
上面示例中RecordKeys, Type的第一个参数a用作对象的键名第二个参数number是a的键值类型。
参数Keys可以是联合类型这时会依次展开为多个键。
// { a: number, b: number }
type T Recorda|b, number;
上面示例中第一个参数是联合类型a|b展开成两个键名a和b。
如果参数Type是联合类型就表明键值是联合类型。
// { a: number|string }
type T Recorda, number|string;
参数Keys的类型必须兼容string|number|symbol否则不能用作键名会报错。
RecordKeys, Type的实现如下。
type RecordK extends string|number|symbol, T { [P in K]: T; } 15. RequiredType
RequiredType返回一个新类型将参数类型Type的所有属性变为必选属性。它与PartialType的作用正好相反。
interface A {x?: number;y: number;
}type T RequiredA; // { x: number; y: number; }
RequiredType的实现如下。
type RequiredT {[P in keyof T]-?: T[P];
};
上面代码中符号-?表示去除可选属性的“问号”使其变成必选属性。
相对应地符号?表示增加可选属性的“问号”等同于?。因此前面的PartialType的定义也可以写成下面这样。
type PartialT {[P in keyof T]?: T[P];
}; 16. ReadonlyArrayType
ReadonlyArrayType用来生成一个只读数组类型类型参数Type表示数组成员的类型。
const values: ReadonlyArraystring [a, b, c];values[0] x; // 报错
values.push(x); // 报错
values.pop(); // 报错
values.splice(1, 1); // 报错
上面示例中变量values的类型是一个只读数组所以修改成员会报错并且那些会修改源数组的方法push()、pop()、splice()等都不存在。
ReadonlyArrayType的实现如下。
interface ReadonlyArrayT {readonly length: number;readonly [n: number]: T;// ...
} 17. ReturnTypeType
ReturnTypeType提取函数类型Type的返回值类型作为一个新类型返回。
type T1 ReturnType() string; // stringtype T2 ReturnType() {a: string; b: number
}; // { a: string; b: number }type T3 ReturnType(s:string) void; // voidtype T4 ReturnType() () any[]; // () any[]type T5 ReturnTypetypeof Math.random; // numbertype T6 ReturnTypetypeof Array.isArray; // boolean
如果参数类型是泛型函数返回值取决于泛型类型。如果泛型不带有限制条件就会返回unknown。
type T1 ReturnTypeT() T; // unknowntype T2 ReturnTypeT extends U, U extends number[]() T
; // number[]
如果类型不是函数会报错。
type T1 ReturnTypeboolean; // 报错type T2 ReturnTypeFunction; // 报错
any和never是两个特殊值分别返回any和never。
type T1 ReturnTypeany; // anytype T2 ReturnTypenever; // never
ReturnTypeType的实现如下。
type ReturnTypeT extends (...args: any) anyT extends (...args: any) infer R ? R : any; 18. ThisParameterTypeType
ThisParameterTypeType提取函数类型中this参数的类型。
function toHex(this: Number) {return this.toString(16);
}type T ThisParameterTypetypeof toHex; // number
如果函数没有this参数则返回unknown。
ThisParameterTypeType的实现如下。
type ThisParameterTypeT T extends (this: infer U,...args: never) any ? U : unknown; 19. ThisTypeType
ThisTypeType不返回类型只用来跟其他类型组成交叉类型用来提示 TypeScript 其他类型里面的this的类型。
interface HelperThisValue {logError: (error:string) void;
}let helperFunctions:{ [name: string]: Function } ThisTypeHelperThisValue{hello: function() {this.logError(Error: Something wrong!); // 正确this.update(); // 报错}
}
上面示例中变量helperFunctions的类型是一个正常的对象类型与ThisTypeHelperThisValue组成的交叉类型。
这里的ThisType的作用是提示 TypeScript变量helperFunctions的this应该满足HelperThisValue的条件。所以this.logError()可以正确调用而this.update()会报错因为HelperThisValue里面没有这个方法。
注意使用这个类型工具时必须打开noImplicitThis设置。
下面是另一个例子。
let obj: ThisType{ x: number } { getX: () number };obj {getX() {return this.x this.y; // 报错},
};
上面示例中getX()里面的this.y会报错因为根据ThisType{ x: number }这个对象的this不包含属性y。
ThisTypeType的实现就是一个空接口。
interface ThisTypeT { }
