听说你熟悉Pick,那就来手写一个MyPick!

这是一个 Pick 函数,它的作用是挑选 keys 属性数组中每个 key 对应的值,组成一个新的对象。

创新互联公司制作网站网页找三站合一网站制作公司,专注于网页设计,成都网站建设、网站建设,网站设计,企业网站搭建,网站开发,建网站业务,680元做网站,已为上千服务,创新互联公司网站建设将一如既往的为我们的客户提供最优质的网站建设、网络营销推广服务!

function Pick(obj, keys) {
const ret = {};
for (const key of keys) {
ret[key] = obj[key];
}
return ret;
}

const user = {
id: 666,
name: "阿宝哥",
address: "厦门",
};

const PickedUser = MyPick(user, ["id", "name"]);

在 JavaScript 中我们操作的是对象,而在 TypeScript 中我们操作的是类型。同样,在 TypeScript 中我们也可以把 User 类型转换成只包含 id 和 name 属性的 PickedUser 类型。

type User = {
id: number;
name: string;
address: string;
};

type PickedUser = {
id: number;
name: string;
};

要实现上述的功能,我们需要使用 TypeScript 提供的映射类型。它是一种泛型类型,可用于把原有的对象类型映射成新的对象类型。

映射类型的语法如下:

{ [ P in K ] : T }

其中 P in K 类似于 JavaScript 中的 for...in 语句,用于遍历 K 类型中的所有类型,而 T 类型变量用于表示 TS 中的任意类型。了解完这些知识之后,我们来定义一个 MyPick 工具类型。

type MyPick = {
[P in K]: T[P];
};

在以上代码中,T、K 被称为类型参数,与 Pick 函数中参数的作用类似。keyof 操作符用于获取某种类型中的所有键,其返回类型是联合类型。如果 keyof 操作的是对象类型,其功能与 Object.keys 方法类似。

而 K extends keyof T 是泛型约束,用于约束类型参数 K 对应的实际类型为对象类型所有键组成的联合类型的子类型。T[P] 用于获取 T 类型中 P 属性对应的类型,其中类型变量 P 的值会在遍历的过程中不断改变。

下面我们来验证一下 MyPick 工具类型,是否实现对应的功能。在实际工作中,若遇到对应的场景,我们可以直接使用 TypeScript 提供的 Pick 工具类型。

type PickedUser = MyPick;

// type PickedUser = {
// id: number;
// name: string;
// }

在 TypeScript 中映射类型非常重要,如果你想深入学习映射类型,可以观看 “用了 TS 映射类型,同事直呼内行!

网页题目:听说你熟悉Pick,那就来手写一个MyPick!
文章链接:http://www.mswzjz.cn/qtweb/news42/42492.html

攀枝花网站建设、攀枝花网站运维推广公司-贝锐智能,是专注品牌与效果的网络营销公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 贝锐智能