当前位置: 代码迷 >> 综合 >> TypeScript高级类型-Partial、Required、Pick、Omit、Readonly
  详细解决方案

TypeScript高级类型-Partial、Required、Pick、Omit、Readonly

热度:93   发布时间:2023-12-11 23:54:26.0

Partial (可选属性,但仍然不允许添加接口中没有的属性)

ts中就是让一个定义中的所有属性都变成可选参数,参数可以变多也可以少。

我们定义 一个user 接口,如下

interface IUser {name: stringage: numberdepartment: string
}//经过 Partial 类型转化后得到type optional = Partial<IUser>// optional的结果如下type optional = {name?: string | undefined;age?: number | undefined;department?: string | undefined;
}

当我们不能明确地确定对象中包含哪些属性时,我们就可以通过Partial来声明。

Required(必选属性)

和Partial刚好相反,将一个定义中的属性全部变成必选参数

让一个类型的属性全部必填

Pick(部分选择)

可能需要从一个已声明的类型中抽取出一个子类型,在子类型中包含父类型中的部分或全部属性,这时我们可以使用Pick来实现,

ts中可以选择一个原来的接口中一部分的属性定义

interface User {id: number;name: string;age: number;gender: number;email: string;
}type PickUser = Pick<User, "id" | "name" | "gender">;// 等价于
type PickUser = {id: number;name: string;gender: number;
};let user: PickUser = {id: 1,name: 'tom',gender: 1
};
// 等价于
type PickUser = {id: number;name: string;gender: number;
};let user: PickUser = {id: 1,name: 'tom',gender: 1
};

Omit(属性忽略) 

与Pick相反,Pick用于拣选出我们需要关心的属性,而Omit用于忽略掉我们不需要关心的属性

interface User {id: number;name: string;age: number;gender: number;email: string;
}// 表示忽略掉User接口中的age和email属性
type OmitUser = Omit<User, "age" | "email">;
// 等价于
type OmitUser = {id: number;name: string;gender: number;
};let user: OmitUser = {id: 1,name: 'tom',gender: 1
};

Readonly (只读属性)

如果要求对象中的一些字段只能在创建的时候被赋值,使用 readonly 定义只读属性(只读的约束存在于第一次给对象赋值的时候,而不是第一次给只读属性赋值的时候)

interface Person {readonly id: number;name: string;age?: number;[propName: string]: any;
}
let tom: Person = {id: 89757,name: 'Tom',gender: 'male'
};
tom.id = 9527;      //  Cannot assign to 'id' because it is a constant or a read-only property

参考博文链接:

TypeScript高级用法详解 - 笑人 - 博客园

https://blog.csdn.net/roamingcode/article/details/104111165

https://blog.csdn.net/qq_39403733/article/details/93807519

  相关解决方案