Typescript:推断嵌套 keyof 属性的类型

2024-02-28

我想定义一个数组类型,它必须包含给定类型的嵌套属性名称链。

假设我有一个类型:

    type Foo = {
        outer: {
            inner: any;
        }
    }

现在我想定义一个包含 2 个元素的数组类型:

type PropertyList<T, K1 extends keyof T, K2 extends keyof T[K1]> = [K1, K2];

我想这样使用它:

let myList:PropertyList<Foo> = ["outer", "inner"]

所以我希望编译器检查包含的 2 个属性名称是否是 Foo 的嵌套属性名称。

但我无法仅使用 1 个通用参数定义 PropertyList,然后我收到此错误:

TS2314: Generic type 'PropertyList' requires 3 type argument(s)

知道如何推断嵌套的 keyof 类型而无需指定它们吗?


陶的回答中给出了如何做到这一点的第一个近似,问题是,如果添加更多属性,它就不会按预期工作:

type Foo = {
    outer: {
        inner: any;
    }
    outer2: {
        inner2: any;
    }
}

type PropertyList<T, K1 extends keyof T = keyof T, K2 extends keyof T[K1] = keyof T[K1]> = [K1, K2];

let myList:PropertyList<Foo> = ["outer", "inner"] // error, since K2 will have to be a property of both outer and outer2

您可以使用函数来帮助根据传递的实际参数推断正确的类型。我们需要使用两个函数的方法,因为我们需要通用参数T, K1 and K2,但我们只想指定T如果我们指定一个参数,我们必须指定所有参数:

function pathFor<T>() {
    return  function <K1 extends keyof T, K2 extends keyof T[K1]>(outer: K1, inner: K2): [K1,K2]{
        return  [outer, inner];
    }
}
// Usage 
let myList = pathFor<Foo>()("outer", "inner"); // typed as ["outer, "inner"]
let myList2 = pathFor<Foo>()("outer2", "inner"); // error, inner is not part of outer2
let myList3 = pathFor<Foo>()("outer2", "inner2"); // typed as ["outer2, "inner2"]

Edit

您还可以扩展该函数以获取有限长度的路径(示例中为 4,但根据需要添加更多):

function keysFor<T>() {
    function keys<K1 extends keyof T, K2 extends keyof T[K1], K3 extends keyof T[K1][K2], K4 extends keyof T[K1][K2][K3]>(outer: K1, inner: K2, innerInner: K3, innerInnerInner: K4): [K1,K2, K3, K4]
    function keys<K1 extends keyof T, K2 extends keyof T[K1], K3 extends keyof T[K1][K2]>(outer: K1, inner: K2, innerInner: K3): [K1,K2, K3]
    function keys<K1 extends keyof T, K2 extends keyof T[K1]>(outer: K1, inner: K2): [K1,K2]
    function keys(): string[]{
        return [...arguments];
    }
    return keys
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Typescript:推断嵌套 keyof 属性的类型 的相关文章

  • TypeScript 中的可等待类型

    我在 JavaScript 中经常使用 async await 现在我正在逐渐将代码库的某些部分转换为 TypeScript 在某些情况下 我的函数接受将被调用和等待的函数 这意味着它可以返回一个承诺 只是一个同步值 我已经定义了Await
  • 当`enableProdMode()`时到底发生了什么[重复]

    这个问题在这里已经有答案了 我正在与Angular2 quick start演示使用TypeScript 一切正常 但在演示完成后 我在浏览器控制台中看到一条消息 Angular 2 正在开发模式下运行 调用enableProdMode 启
  • 如何找到我的 typescript/react 模块的声明?

    我对前端技术非常 非常 陌生 特别是 React 和 TypeScript 当尝试做一件简单的事情 即使用反应组件时 我的问题出现了https github com ckeditor ckeditor5 https github com c
  • tsconfig.json:构建:在配置文件中找不到输入

    我有一个 ASP NET core 项目 当我尝试构建它时收到此错误 error TS18003 Build No inputs were found in config file Z Projects client ZV src ZV S
  • 将元素追加到 Angular QueryList

    有没有办法将新元素追加到 QueryList 中 例如 我有一个像这样的查询列表 ContentChildren SysColumn syscolumns QueryList
  • TSLint :变量名必须是驼峰或大写

    我有一些以下划线开头的变量名称 更新 tslint json 后我仍然收到此警告 tslint json extends tslint recommended rules variable name true ban keywords ch
  • 如何在 Angular2 中脏检查可迭代组件属性?

    看一下这个简单的 Angular2 组件 Component selector status area directives template require status area tpl jade export class Status
  • AWS Serverless Lambda + Angular - TypeError:express 不是函数

    该应用程序在 localhost 4200 中运行良好 但是 当我通过无服务器 Lambda 迁移到 AWS 时 我在 cloudwatch 日志中收到此错误 我想正因为如此我得到了500 message Internal server e
  • Typescript 泛型 - “扩展对象”毫无意义吗?最佳实践是什么?

    我注意到了 p 泛型通常是没有意义的 因为基本上 javascript 中的所有内容都是对象 大多数文字都是具有 toString 方法的对象 字符串是具有 length 属性等的对象 我更喜欢 p p 但很好奇其他人注意到了什么 我现在没
  • Ionic 2 自定义后退按钮操作

    我想自定义此屏幕截图中提到的后退按钮的单击操作 我希望通过单击我不会返回到上一页 而是返回到我自己指定的页面 或者在返回之前进行处理 要自定义默认后退按钮操作 您需要覆盖返回按钮点击 NavBar 组件的方法 Step 1 在你的 自定义类
  • 如何使用 Typescript 从 mui 扩展调色板

    我正在尝试扩展 mui 提供的调色板 覆盖主色 次要颜色等效果很好 但如果我想在之后创建一组自定义颜色 我不知道如何使其工作 有很多没有打字稿的例子 但是当这个人进入游戏时 事情就变得更加棘手 假设我有这个 主题 tsx palette p
  • 从打字稿中的数组中删除对象

    如何从打字稿中的数组中删除对象 revenues drug id 20 quantity 10 drug id 30 quantity 1 所以我想从所有对象中删除 drug id 我怎样才能做到这一点 谢谢你 你可以用它 this rev
  • React-Native 博览会 POST Blob

    我正在使用 React Native 和 expo 并尝试通过 fetch api 发布 blob 图像 我对正文使用表单数据格式 并且我有下一个代码 const blob await response blob const form ne
  • ng2-select 中的数据绑定失败

    我正在尝试使用 ng2 select 将对象数组绑定到下拉列表 当我尝试使用字符串数组时它工作正常 private category Array value 1 text Table value 2 text Chair value 3 t
  • 注解和装饰器有什么区别?

    我很困惑何时使用术语注释以及何时使用装饰器 Component selector tabs template export class Tabs 装饰器对应于在类上调用的函数 而注释是使用 Reflect Metadata 库在类上设置的
  • 如何在 Javascript 中将字符串数组转换为特定的树结构

    我从后端获取文件路径列表 它代表文件夹结构 如下所示 paths path to file1 doc path to file2 doc foo bar doc 路径的长度是任意的 为了使用文件树组件 角度2树组件 https github
  • Typescript 编译错误:类型“typeof e”上不存在属性“bodyParser”

    我想在我的节点 express 环境中使用打字稿 托管在 Cloud 9 ide 中 我在尝试让编译器编译 app ts 时遇到问题 它出现了几个错误 其中属性 bodyParser 在类型 typeof e 上不存在就是其中之一 我在应用
  • 不支持函数调用。考虑用对导出函数的引用替换函数或 lambda

    我在我的应用程序中使用 APP INITIALIZER 并在 app module ts 中将其设置如下 并进行必要的导入 NgModule providers ContextService provide APP INITIALIZER
  • 在 Typescript 中从基类创建子类的新实例[重复]

    这个问题在这里已经有答案了 我想创建新实例Child班级来自Base类方法 这有点复杂 但我会尽力解释 这是一个例子 class Base constructor clone Here i want to create new instan
  • 让管道自我刷新角度

    我有来自后端的静态时间戳 我想每 1 秒刷新一次管道以获取现在的日期 这是我的烟斗 import Pipe PipeTransform from angular core import moment from moment Pipe nam

随机推荐

  • 词法或处理器问题:未找到 boost/config/user.hpp' 文件

    当我在 Xcode 中运行 React Native 应用程序时 它显示错误 boost config user hpp 文件未找到 而且当我使用命令 react native run ios 运行应用程序时 我在终端中收到错误 Comma
  • gdax-java 作为库的实现

    我正在尝试实现这个API https github com robevansuk gdax java https github com robevansuk gdax java以便能够通过 Coinbase 创建订单 提取资金和存入资金并在
  • 在ANDROID中打开一个activity而不在manifest文件中声明它?

    我想打开一个活动而不在清单文件中声明它 我不知道这是否可能 我真正想要的是使用意图从我的程序中动态打开一个活动 如果可能的话 任何人都可以帮助我吗 不可能 虽然我不确定你的意思是 动态打开活动 See http developer andr
  • 覆盖 FOSUserBundle 路由 Symfony2

    我想覆盖 FOSUserBundle 的一些路由 MyBundle Resources config routing security yml fos user security login path locale login defaul
  • Spyder 内部问题,如何解决?

    我对编码完全陌生 但是 当我尝试运行如图所示的一些代码时 出现了这个问题 我尝试重新安装但不起作用 Spyder 维护者在这里 带来不便敬请谅解 这是 Anaconda 中的一个错误 我们已经向他们报告了该错误 但尚未修复 如果您只需要使用
  • 将 SVG 元素添加到 html 文件中?

    我想将一些 SVG 元素添加到 html 文件中 我发现链接说不支持此功能 文档类型必须是 xhtml 但我正在使用一些带有 html 的 javascript 库 这些库允许我在其中使用 SVG Raphael SVG Web 等 那么有
  • 在开发过程中禁用浏览器缓存 css 和 js 文件

    如何在应用程序开发过程中禁用浏览器缓存 以便每当我们对本地主机 或任何开发环境 中的 css 或 js 文件进行任何更改时 我们都不必在浏览器上进行硬刷新才能看到更改 对所有 css 和 js 都尝试这个 这个例子你应该在所有css和js中
  • Laravel 中间件单元测试

    我正在尝试在 Laravel 中为我的中间件编写单元测试 有谁知道教程 或者有这方面的例子吗 我已经写了很多代码 但是一定有更好的方法来测试handle方法 使用 Laravel 5 2 我通过向中间件传递带有输入的请求和带有断言的闭包来对
  • 如何让 Scalaz ZIO 变懒?

    我有一个严重的副作用函数 想想数据库调用 我想将其用作惰性值 以便仅在第一次使用时调用它 如果从未使用过则根本不会调用 我该如何使用 ZIO 做到这一点 如果我的程序如下所示 则该函数仅被调用一次 但甚至根本不使用结果 import sca
  • 登录页面Cognito的定制

    我知道可以在 Cognito 提供的登录页面上自定义一些值 但这对我来说还不够 是否可以完全定制 我只使用网络应用程序中的第三方联合身份验证 是否可以更改灰色背景 或者放在那里完全不同的观点 由于背景灰色无法再修改 我们可以使用一些 CSS
  • 如何分析Websphere core*.dmp 文件和Snap*.trc 文件?

    全部 我的应用程序在 websphere 应用程序服务器 7 0 上运行 我得到了一些核心转储和跟踪文件 例如 核心 20110909 164930 3828 0001 dmp and 快照 20110909 164930 3828 000
  • 使用 Flash、PHP、Red5 从浏览器录制视频

    我希望构建一个应用程序 使用它可以录制视频 以及音频 和音频 最好仅录制 mp3 格式的音频 根据我所做的一些研究 我发现我需要一个 Flash 或 Flex 客户端应用程序 一个 RTMP 服务器 RED5 最好 因为它是免费的 这是我用
  • 加载时重置缩放级别

    我没有 iPhone 所以无法自己测试这一点 但根据客户的说法 如果他放大以更轻松地单击链接 那么当下一页加载时 页面会保持放大状态 而用户必须手动缩小再次 请注意 这不是响应式网站 它没有设置元宽度 设备宽度 有什么办法可以防止这种情况发
  • 何时调用obtainPermanentIDsForObjects:?

    我目前遇到一个问题 即在后台子线程 其父级是主 UI 线程上下文 上创建新对象并保存会导致我的NSFetchedResultsController显示两个新对象 一个带有临时对象objectID 以及一个具有永久objectID 这似乎是某
  • 在 Chrome 中将焦点设置在 iframe 上

    我有一个 iframe id chat with designMode on 在 Chrome 中 在 Enter 按键事件上我调用该函数send 它获取 iframe 内容并将其写入套接字 我的问题是 当清除 iframe 时 我失去了焦
  • 开发流程、部署、GitHub

    我正在努力为我们的团队制定一个开发流程 任何时候 我们都有 3 4 分散的开发人员在我们的代码库上工作 我们已经开始使用 GIT 我们的想法是 工作不仅仅是实时修复 然后他们分叉了 master 分支 每个人在服务器上都有自己的开发环境 并
  • 函数数组和分段错误 - 无效的内存引用

    我正在尝试设置我的功能f作为数组 但我收到以下错误 Program received signal SIGSEGV Segmentation fault invalid memory reference Backtrace for this
  • C# UDP广播和接收示例

    问题 我正在尝试将 udp 套接字绑定到特定地址 我会广播一条消息 同一个套接字需要能够接收消息 当前代码 static void Main UdpClient Configuration new UdpClient new IPEndPo
  • gnuplot - 彩色刻度线

    有什么办法可以拥有gnuplot为 x 和 或 y 轴上的刻度线着色 我正在使用背景png文件非常暗 我希望内部抽动在其上显示为白色 而不是默认的黑色 The tics似乎继承了它们的颜色border set style line 50 l
  • Typescript:推断嵌套 keyof 属性的类型

    我想定义一个数组类型 它必须包含给定类型的嵌套属性名称链 假设我有一个类型 type Foo outer inner any 现在我想定义一个包含 2 个元素的数组类型 type PropertyList