美文网首页
【类型挑战】实现 Pick,难度⭐️

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

作者: DevSpoon | 来源:发表于2022-04-10 00:56 被阅读0次

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


知识运用:

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

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

题目分析:

题目地址:4-easy-pick

image.png
如图所示我们需要设计一个通用类型工具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,难度⭐️,尽情期待!


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

本文由博客一文多发平台 OpenWrite 发布!

相关文章

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

    Dear,大家好,我是“前端小鑫同学”,?长期从事前端开发,安卓开发,热衷技术,在编程路上越走越远~ 知识运用: ...

  • 点击拍照

    实现pick的代理方法,然后在代理方法中实现照片预览。

  • 高级TypeScript类型

    本文将提供使用typescript高级类型(Record,Partial,Required,Pick , Omit...

  • 69. x的平方根(Python)

    题目 难度:★★☆☆☆类型:数组 实现 int sqrt(int x) 函数。 计算并返回 x 的平方根,其中 x...

  • 07-TypeScirpt-映射类型-分布式条件类型

    映射类型 根据旧的类型创建出新的类型, 我们称之为映射类型 Pick映射类型将原有类型中的部分内容 映射到新的类型...

  • 类型演算之Pick

    React中的应用 巧用Pick给props以默认值

  • 50. Pow(x, n)

    更多精彩内容,请关注【力扣中等题】。 题目 难度:★★☆☆☆类型:数学方法:运算性质 实现 pow(x, n) ,...

  • iOS多线程总结

    类型简介实现语言线程生命周期pthreadposix接口,适合跨平台开发,使用难度较大c手动管理NSThread面...

  • 制定一份属于自己的跃迁实施方案

    一.根据学习原理,有4种方法可以大幅度提高学习效率: ·必要难度:挑战有一定难度的事情 ·单一目标:不要同时实现若...

  • 读书笔记《精进,如何成为一个厉害的人》20

    挑战是设计出来的 ——不断为自己设计“必要的难度”挑战 高难度挑战,激发无限潜能 采铜举例“李纳斯.托瓦...

网友评论

      本文标题:【类型挑战】实现 Pick,难度⭐️

      本文链接:https://www.haomeiwen.com/subject/ljnmsrtx.html