【类型挑战】实现 Pick，难度⭐️

一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第1天，点击查看活动详情。

Dear，大家好，我是“前端小鑫同学”，😇长期从事前端开发，安卓开发，热衷技术，在编程路上越走越远～

---

知识运用：

在实现Pick这道题目的过程中运用到的知识点如下：

1. Keyof 类型运算符；
2. Mapped Types 映射类型；
3. Indexed Access Types：索引访问类型；
4. 泛型中约束类型参数；

题目分析：

题目地址：4-easy-pick 如图所示我们需要设计一个通用类型工具MyPick来支持从接口Todo中获取到title或completed属性并组成一个新的类型。

题目解答：

测试用例：

1. 满足从Todo接口取出属性title及类型与Expected1类型一致。
2. 满足从Todo接口取出属性title和completed及类型构成联合类型与Expected2类型一致。
3. 当需要取出在Todo中不存在的属性invalid及类型时将抛出错误。

/* _____________ 测试用例 _____________ */
// 完整测试用例可见 type-challenges项目，点击题目链接可转到
import { Equal, Expect } from '@type-challenges/utils'
 
type cases = [
  Expect<Equal<Expected1, MyPick<Todo, 'title'>>>,
  Expect<Equal<Expected2, MyPick<Todo, 'title' | 'completed'>>>,
  // @ts-expect-error
  MyPick<Todo, 'title' | 'completed' | 'invalid'>,
]

答案及解析：

/* _____________ 答案 _____________ */
 
type MyPick<T, K extends keyof T> = {
  [key in K]: T[key]
}

在演练场验证答案

1. 通过keyof T来得到接口中所有属性的字符串组成的合集；
2. 使用in来遍历联合类型K得到每次遍历的值key，形式为[key in keyof T]；
3. 使用索引访问类型，得到接口中特定属性的类型，形式为T[key]；
4. 使用extends来约束K均来自于T中；

在演练场看解题过程

接下来的一题是：【类型挑战】实现 Readonly，难度⭐️，尽情期待！

推荐：GFE前端团队，欢迎各位XD点赞，评论，关注~

---

欢迎关注我的公众号“前端小鑫同学”，原创技术文章第一时间推送。