The keyof operator produces a union type of all known, public property names of a given type. You can use it together with lookup types (aka indexed access types) to statically model dynamic property access in the type system.

Take away:

1. extends

2. keyof

interface Todo {
id: number;
text: string;
completed: boolean;
} const todo: Todo = {
id: ,
text: "Buy milk",
completed: false
} // K extends keyof T: K will be the unit types of 'id', 'text', 'completed'
// T[K] is the lookup tells the Typescript the correct return type
function prop<T, K extends keyof T>(obj: T, key: K): T[K] {
return obj[key];
} type TodoId = Todo['id'];
type TodoText = Todo['text'];
type TodoCompleted = Todo['completed']; const id: TodoId = prop(todo, 'id'); // type number
const text: TodoText = prop(todo, 'text'); // type string
const completed: TodoCompleted = prop(todo, 'completed'); // type boolean

[TypeScript] Query Properties with keyof and Lookup Types in TypeScript的更多相关文章

  1. [TypeScript] Understand lookup types in TypeScript

    Lookup types, introduced in TypeScript 2.1, allow us to dynamically create types based on the proper ...

  2. [TypeScript] Transform Existing Types Using Mapped Types in TypeScript

    Mapped types are a powerful and unique feature of TypeScript's type system. They allow you to create ...

  3. [TypeScript] Deeply mark all the properties of a type as read-only in TypeScript

    We will look at how we can use mapped types, conditional types, self-referencing types and the “infe ...

  4. [TypeScript] Model Alternatives with Discriminated Union Types in TypeScript

    TypeScript’s discriminated union types (aka tagged union types) allow you to model a finite set of a ...

  5. [TypeScript] Represent Non-Primitive Types with TypeScript’s object Type

    ypeScript 2.2 introduced the object, a type that represents any non-primitive type. It can be used t ...

  6. [TypeScript] Using Assertion to Convert Types in TypeScript

    Sometimes the compiler needs help figuring out a type. In this lesson we learn how to help out the c ...

  7. [TypeScript] Dynamically Allocate Function Types with Conditional Types in TypeScript

    Conditional types take generics one step further and allow you to test for a specific condition, bas ...

  8. [TypeScript] Make Properties and Index Signatures Readonly in TypeScript

    TypeScript 2.0 introduced the readonly modifier which can be added to a property or index signature ...

  9. [TypeScript] Using Interfaces to Describe Types in TypeScript

    It’s easy to pass the wrong value to a function. Typescript interfaces are great because they catch ...

随机推荐

  1. VsCode使用之HTML 中 CSS Class 智能提示

    HTML 中 CSS Class 智能提示 安装插件:HTML CSS Support 设置中添加以下代码: "editor.parameterHints": true, &quo ...

  2. selective_search_rcnn.m中代码

    im = imresize(im, [NaN im_width]):把图像转换为宽度为im_width,自动计算列数

  3. 第1节 flume:10、flume的更多组件介绍

    作业:flume如何实现收集mysql的数据,没隔几秒钟,查看mysql中的数据是否有变化,一旦有变化,把数据拿过来,存到hdfs上. 需要使用custom source.可网上搜索,github上.

  4. Spring Data Redis入门示例:程序配置(五)

    单机配置 redis.properties配置 #redis的服务器地址 redis.host=127.0.0.1 #redis的服务端口 redis.port=6379 #客户端超时时间单位是毫秒 ...

  5. 遇到的django问题

    问题1: No migrations to apply 删除了migrations中0001_initial.py文件,重新执行 python manage.py makemigrations pyt ...

  6. ARP 协议

    1. 什么是ARP协议? 网络层以上的协议用IP地址来标识网络接口,但以太数据帧传输时,以物理地址来标识网络接口.因此我们需要进行IP地址与物理地址之间的转化.对于IPv4来说,我们使用ARP地址解析 ...

  7. /etc/rc.d启动目录详解

    操作系统:CentOS6.6_32位 控制脚本目录/etc/rc.d,该目录下存在各个运行级别的脚本文件,执行ls /etc/rc.d,显示结果为:init.d  rc  rc0.d  rc1.d   ...

  8. LeetCode 467. Unique Substrings in Wraparound String

    Consider the string s to be the infinite wraparound string of "abcdefghijklmnopqrstuvwxyz" ...

  9. Vue如何在webpack设置代理解决跨域问题

            在开发过程中我们请求数据有时候调用的是第三方接口,此时便会遇到一个问题:跨域限制.对于跨域问题的解释就不详细叙述了,要了解的请自行百度.一般跨域问题控制台会报这个错:         ...

  10. luogu1856 [USACO5.5]矩形周长Picture

    看到一坨矩形就要想到扫描线.(poj atantis) 我们把横边竖边分开计算,因为横边竖边其实没有区别,以下论述全为考虑竖边的. 怎样统计一个竖边对答案的贡献呢?答:把这个竖边加入线段树,当前的总覆 ...