Ts中内置类型

本文详细介绍了TypeScript中的高级类型特性,如Partial、Required、Readonly、Record、Pick、Omit、Exclude、Extract等,展示了如何通过这些类型操作进行类型检查、对象结构管理和函数参数管理。
摘要由CSDN通过智能技术生成

Ts
是js的超集,可以编译成js,主要提供类型检查的作用

Ts内置类型
ts内置了一些类型,这些类型可以进行其他类型的类型转化

具体类型
Partial
作用
Partial 构造一个类型 使T里的所有属性都设置可选

实现
type Partial<T> = { [P in keyof T]?: T[P] | undefined; }

使用
interface Exp1 {
    name: string;
    age:number;
}
type PartialExp1  = Partial<Exp1>

PartialExp1 的类型

type PartialExp1 = {
    name?: string | undefined;
    age?: number | undefined;
}

Required
作用
Required 使T 所有属性都设为required 与partial相反

实现
type Required<T> = { [P in keyof T]-?: T[P]; }

使用
interface Exp2  {
    name?:string;
    age:number;
}
type RequireExp2  = Required<Exp2>

RequireExp2的类型为:

type RequireExp2 = {
    name: string;
    age: number;
}

Readonly
作用
Readonly 将type中所有属性设置为只读

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

使用
interface Exp3 {
    name:string;
    age:number;
}
type ReadonlyExp3 = Readonly<Exp3>;

ReadonlyExp3:

type ReadonlyExp3 = {
    readonly name: string;
    readonly age: number;
}

Record
作用
Record<keys,T> 构造一个类型 属性键为keys 属性名位T 。可以用来规定对象的属性 名 以及值的类型

实现
type Record<K extends string | number | symbol, T> = { [P in K]: T; }

使用
type Exp4 = 'A'|'B'|'C'
type RecordExp4  = Record<Exp4,number>

interface Exp5{
    title:string;
}
type RecordExp5=  Record<Exp4,Exp5>

使用后类型为:

type RecordExp4 = {
    A: number;
    B: number;
    C: number;
}
type RecordExp5 = {
    A: Exp5;
    B: Exp5;
    C: Exp5;
}

Pick
作用
Pick<Type, keys> 从Type中选出一组keys来构造一个类型

实现
type Pick<T, K extends keyof T> = { [P in K]: T[P]; }

使用
interface Exp6 {
    title:string;
    age:number;
    sex:number
}
type PickExp6 = Pick<Exp6,'title'|'age'>

结果为:

type PickExp6 = {
    title: string;
    age: number;
}

Omit
作用
Omit<Type, keys> 从Type中删除所有keys 来构造一个类型 与PIck相反

实现
type Omit<T, K extends string | number | symbol> = { [P in Exclude<keyof T, K>]: T[P]; }

使用
interface Exp7 {
    title: string;
    age:number;
    sex:number
}
type OmitExp7  = Omit<Exp7,'title'>

结果为:

type OmitExp7 = {
    age: number;
    sex: number;
}

Exclude
作用
Exclude<T,U> 从T中排除可分配给U的的类型,返回联合类型

实现
在extends 联合类型时 会分布式的去比较

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

使用
type Exp8 = 'title' | 'age' | 'sex';
type Exp9 = 'title'|'age';
type Exclude8 = Exclude<Exp8,Exp9>

结果为

type Exclude8 = "sex"

Extract
作用
Extract<T,U> 从T中提取可以分配给U的属性构造成一个新的联合类型 和Exclude相反

实现
type Extract<T, U> = T extends U ? T : never

使用
type Exp10 = 'title' | 'age' | 'sex';
type Exp11 = 'title'|'age';
type ExtractExp10 = Extract<Exp10,Exp11>

结果为

type ExtractExp10 = "title" | "age"

NonNullable
作用
NonNullable 从 T中排除 null 和 underfined 来构造一个类型

实现
type NonNullable<T> = T & {}

使用
type Exp12 = string|null|number|undefined;
type NonNullableExp12 = NonNullable<Exp12>

结果为

type NonNullableExp12 = string | number

Parameters
作用
Parameters 从 函数类型T中使用的参数类型 构造元组类型

实现
现在在有条件类型的 extends 子语句中,允许出现 infer 声明,它会引入一个待推断的类型变量。 这个推断的类型变量可以在有条件类型的 true 分支中被引用。 允许出现多个同类型变量的 infer。

type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never

使用
type Exp13 = (title:string,age:number)=>void;
type ParametersExp13 = Parameters<Exp13>

结果:

type ParametersExp13 = [title: string, age: number]

ConstructorParameters
作用
ConstructorParameters 从构造函数的参数类型来构造元组类型

实现
type ConstructorParameters<T extends abstract new (...args: any) => any> = T extends abstract new (...args: infer P) => any ? P : never

使用
interface Exp14 {
    new(title:string,age:number):Object
}
type ConstructorParametersExp14 = ConstructorParameters<Exp14>

结果为:

type ConstructorParametersExp14 = [title: string, age: number]

ReturnType
作用
ReturnType 构造一个由函数类型 T返回类型组成的类型

实现
type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any

使用
type Exp15 = (title:string,age:number) => string| number;
type ReturnTypeExp15 = ReturnType<Exp15>

结果:

type ReturnTypeExp15 = string | number

InstanceType
作用
InstanceType 返回由T中构造函数的实例组成的类型

实现
type InstanceType<T extends abstract new (...args: any) => any> = T extends abstract new (...args: any) => infer R ? R : any

使用
interface Exp17{
  title:string;
  age:number
}
interface Exp16  {
    new(title:string,age:number):Exp17;
}
type InstanceTypeExp16 =  InstanceType<Exp16>

结果

type InstanceTypeExp16 = Exp17

ThisParameterType
作用
ThisParameterType 返回T函数类型中this参数的类型,无返回unkonwn

实现
type ThisParameterType<T> = T extends (this: infer U, ...args: never) => any ? U : unknown

使用
// 声明
type Exp18 = (this:number)=>number;
type ThisParameterTypeExp18 = ThisParameterType<Exp18>
// 未声明
type Exp181 = (age:number)=>number;
type ThisParameterTypeExp181 = ThisParameterType<Exp181>

结果:

// 声明
type ThisParameterTypeExp18 = number
// 未声明
type ThisParameterTypeExp181 = unknown

OmitThisParameter
作用
OmitThisParameter 从 T函数类型中移除this参数 如果不存在 返回T 存在这创建一个不带此参数的新函数类型

实现
type OmitThisParameter<T> = unknown extends ThisParameterType<T> ? T : T extends (...args: infer A) => infer R ? (...args: A) => R : T

使用
type Exp19 = (this:number,age:number,title:string)=>number;
type OmitThisParameterExp19 = OmitThisParameter<Exp19>

结果:

type OmitThisParameterExp19 = (age: number, title: string) => number

ThisType
作用
ThisType 在对象字面量中键入this 为Type,并可以通过上下文类型控制this类型

实现
使用限制:

在–noImplicitThis的选项下起效
仅支持在对象字面量上下文中使用,在其他地方使用相当于空接口
interface ThisType<T>

使用
type Exp20 = {bar:()=>void}
type ThisTypeExp20 = Exp20 & ThisType<{title:string}>
const Exp20: ThisTypeExp20 = {
    bar() {
         console.log(this.title); 
    }
}

结果:

this: {
    title: string;
}

Uppercase & Lowercase
作用
将StringType转为全大写/小写,ts通过内置关键字intrinsic在编译器实现

实现
type Uppercase<S extends string> = intrinsic
type Lowercase<S extends string> = intrinsic

使用
// Uppercase
type Exp21 = 'titLe';
type UppercaseExp21 = Uppercase<Exp21>

// Lowercase
type Exp22 = 'TiTLE';
type LowercaseExp22 = Lowercase<Exp22>

结果:

type UppercaseExp21 = "TITLE"
type LowercaseExp22 = "title"

Capitalize & Uncapitalize
作用
将 string type 首字母转为大写/小写,通过关键字 intrinsic编译阶段实现

实现
type Capitalize<S extends string> = intrinsic
type Uncapitalize<S extends string> = intrinsic

使用
//Capitalize
type Exp23  = 'title';
type CapitalizeExp23 = Capitalize<Exp23>

// Uncapitalize
type Exp24 = 'Title'
type UncapitalizeExp24 = Uncapitalize<Exp24>

结果:

type CapitalizeExp23 = "Title"
type UncapitalizeExp24 = "title"

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值