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

简介: 【类型挑战】实现 Readonly,难度⭐️

知识运用:


  1. 认识什么是readonly,和常量的区别是什么?
  2. Indexed Access Types:索引访问类型;
  3. Keyof 类型运算符;
  4. Mapped Types 映射类型;


题目分析:


题目地址:7-easy-readonly8.png如图所示我们需要设计一个通用类型工具MyReadonly接收传入的Todo接口并遍历每一条属性去设置为只能读取不能编辑,并返回这样的类型结构,功能同Readonly。


题目解答:


测试用例:

  1. 测试用例很简单,就是比较我们实现的类型工具和内置Readonly类型工具的到的结果是否一致;
  2. 当然我们也可以声明一个变量并约束类型为我们实现的类型工具返回的类型,重新赋值后看是否成功。
/* _____________ 测试用例 _____________ */
// 完整测试用例可见 type-challenges项目,点击题目链接可转到
import { Equal, Expect } from '@type-challenges/utils'
type cases = [
  Expect<Equal<MyReadonly<Todo1>, Readonly<Todo1>>>,
]
interface Todo1 {
  title: string
  description: string
  completed: boolean
  meta: {
    author: string
  }
}
复制代码


答案及解析:

目标是对传入的接口的每一条属性增加readonly属性

  1. 返回的结果始终是一个对象来表示
  2. 实现的格式:readonly key:value,key指的是Todo的属性,value指的是Todo的属性对应的类型
  3. 如何得到value:通过索引类型访问T[key]的形式获取
  4. 如何遍历接口类型的每一条属性:通过映射类型关键词in,形式为[key in 类型字符串集合]
  5. 如何得到接口每一条属性组成的类型字符串集合:使用keyof来得到
/* _____________ 答案 _____________ */
type MyReadonly<T> = {
  readonly [key in keyof T]: T[key]
}
复制代码


在演练场验证答案



相关文章
|
Java 编译器 C语言
【JAVA数据结构】Java语法完善补充
JAVA数据结构 & Java语法完善补充
40 0
【JAVA数据结构】Java语法完善补充
|
测试技术 C++
软件测试面试题:在C/C++中static有什么用途?(请至少说明两种)
软件测试面试题:在C/C++中static有什么用途?(请至少说明两种)
113 0
|
测试技术
【类型挑战】Readonly 2,难度⭐️⭐️
【类型挑战】Readonly 2,难度⭐️⭐️
142 0
【类型挑战】Readonly 2,难度⭐️⭐️
|
测试技术
【类型挑战】Exclude,难度⭐️
【类型挑战】Exclude,难度⭐️
128 0
【类型挑战】Exclude,难度⭐️
|
测试技术 索引
【类型挑战】Includes,难度⭐️
【类型挑战】Includes,难度⭐️
148 0
【类型挑战】Includes,难度⭐️
|
前端开发 测试技术
【类型挑战】Awaited,难度⭐️
【类型挑战】Awaited,难度⭐️
115 0
【类型挑战】Awaited,难度⭐️
|
测试技术
【类型挑战】If,难度⭐️
【类型挑战】If,难度⭐️
106 0
【类型挑战】If,难度⭐️
|
测试技术
【类型挑战】Push,难度⭐️
【类型挑战】Push,难度⭐️
123 0
【类型挑战】Push,难度⭐️
|
测试技术 索引
【类型挑战】实现 Pick,难度⭐️
【类型挑战】实现 Pick,难度⭐️
132 0
【类型挑战】实现 Pick,难度⭐️
|
测试技术
【类型挑战】深度 Readonly,难度⭐️⭐️
【类型挑战】深度 Readonly,难度⭐️⭐️
298 0
【类型挑战】深度 Readonly,难度⭐️⭐️