小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
背景
XDM,瞧我发现了什么,就如开头说的这样,小知识,大挑战!本文正在参与程序员必备小知识,我真的不是为了奖励,才在一天里更新两篇水文,纯粹是为了学习,学习使我快乐,你们记得要信我!咳咳!上次自己手写了Record,不知道各位看官满意否(虽然我知道也没什么人看),废话不多说,真的不是为了奖励,我们接下来看下传说中的Pick,字面意思就是选择挑选!看它怎么个挑法,进入我们的学习之旅
正文
官方例子
先来看下官方的例子,以及说明,看懂了才好实现嘛
Constructs a type by picking the set of properties Keys (string literal or union of string literals) from Type.
interface Todo {
title: string;
description: string;
completed: boolean;
}
type TodoPreview = Pick<Todo, "title" | "completed">;
const todo: TodoPreview = {
title: "Clean room",
completed: false,
};
todo;
来来来,Todo的接口的确出名,官方好多例子都用了这个接口名,初始的Todo接口,有3个字段,分别是balabalabala,然后现在的需求就是,我不想要description了,但不想改变原本的接口,我只取里面的2个title和completed(别着急,之后有全新的Utility Type支持反选哦)该怎么处理,Pick就诞生了!这边XDM在注意个细节,因为是Pick挑选,那自然我们挑选的key是原本这个接口里有的key,这个也是我们实现时需要考虑的,现在开始表演实现Pick功能
开始实现
老样子,废话文学,我们看Pick需要传入两个泛型,所以架子自然而然就是这样的
type MyPick<T, K> = {
}
T代表我们传入的类型,K代表我们挑选的key有哪些嘛,接下去我们来实现,挑选的key必然是之前接口里有的key,所以keyof和extends,给我上
type MyPick<T, K extends keyof T> = {
}
感觉已经完成一大半了,之后当然就是对挑选出来的key进行遍历,然后标注他们本来的类型
type MyPick<T, K extends keyof T> = {
[P in K]: T[P]
}
实现好了看下源码和我们是否一样吧
源码讲解
直接上源码
/**
* From T, pick a set of properties whose keys are in the union K
*/
type Pick<T, K extends keyof T> = {
[P in K]: T[P];
};
简直完全一摸一样,我真是个小天才,实现的过程和步骤在上面的这个环节已经解说,这边就不再赘述了!希望XDM看的满意,多多支持,可以和小白的我一起探讨,如果有什么解说不太正确的,也希望各位大佬轻喷,并且指导!谢谢观看,今天的水文真结束了!