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. Python基础3 函数 变量 递归 -DAY3

    本节内容 1. 函数基本语法及特性 2. 参数与局部变量 3. 返回值 嵌套函数 4.递归 5.匿名函数 6.函数式编程介绍 7.高阶函数 8.内置函数 温故知新 1. 集合 主要作用: 去重 关系测 ...

  2. 【洛谷2019 OI春令营】期中考试

    T68402 扫雷 题目链接:传送门 题目描述 扫雷,是一款单人的计算机游戏.游戏目标是找出所有没有地雷的方格,完成游戏:要是按了有地雷的方格,游戏失败.现在 Bob 正在玩扫雷游戏,你作为裁判要判断 ...

  3. MySQL-07 日志管理

    学习目标 MySQL日志 二进制日志 错误日志 查询通用日志 慢查询日志 MySQL日志 MySQL日志分为四类,说明如下: 错误日志:记录MySQL服务的启动.运行或者停止时出现的问题. 查询日志: ...

  4. 安装docker和docker-compose

      环境:centos7,参考官方文档:https://docs.docker.com/insta... 第一步:删除旧版本和相关依赖,运行命令: yum remove docker \ docker ...

  5. node程序的部署神器pm2的基本使用

    pm2是从nodejs衍生出来的服务器进程管理工具,可以做到开机就启动nodejs.当然了,也可以用nohup来做这件事情的. 前言 众所周知,Node.js运行在Chrome的JavaScript运 ...

  6. 前段开发 react native tab功能

    import React, { Component } from 'react'; import { StyleSheet, Text, View, Image, } from 'react-nati ...

  7. 【JDBC-MVC模式】开发实例

    JDBC - 开发实例-MVC模式  1. 在web.xml中配置连接数据库的信息 web.xml: <context-param> <param-name>server< ...

  8. 阿里巴巴集团加入W3C,成为W3C会员

    根据W3C官方推特最新消息:阿里巴巴集团正式加入W3C,成为W3C会员. W3C官方推特:https://twitter.com/w3c/status/566244180372889601 同时可以在 ...

  9. zoj 2201 No Brainer

    No Brainer Time Limit: 2 Seconds      Memory Limit: 65536 KB Zombies love to eat brains. Yum. Input ...

  10. [luoguP1835] 素数密度_NOI导刊2011提高(04)(素数筛)

    传送门 数据辣么大,怎么搞?(L≤R≤2147483647) 注意到R-L≤1000000 所以可以直接筛R-L区间内的数, 但是需要用已知的小的素数筛, R-L区间内的大部分数肯定能用较小的素数筛去 ...