如何创建一个新对象,其中键作为一个对象的值,该对象作为值?

2023-12-08

我的问题有点类似于this

我有一个映射,其键为 objectType1,值为 objectType1 |无效的。

type ObjectType1 = { key:string , value:string }
const newMap = new Map<ObjectType1, Array<ObjectType1>|null>([
   [{key:'key1', value:'value1'},null],
]);

我想要在这里做的是我想要一个看起来像这样的新对象:

const newObject = {
   key1 : {key: 'key1', value:'value1'}
 }

所以基本上新对象应该能够引用该对象。如果我执行 newObject.key1,我应该能够获取对象 {key: 'key1', value:'value1'}

我该怎么办?


有多种方法可以迭代Map的键并将它们收集到一个对象中。这是一个:

const newObject =
  Array.from(newMap.keys()).
    reduce<Record<string, ObjectType1 | undefined>>(
      (acc, k) => ({ ...acc, [k.key]: k }), {}
    );
// const newObject: Record<string, ObjectType1 | undefined>

这里我们使用的是the keys()的方法Map获取所有关键对象的可迭代迭代器。这不是一个数组,因为我们要使用the reduce()的方法Array要处理它,我们首先需要通过以下方式将其转换为数组the Array.from() method.

So Array.from(newMap.keys())现在是一个键数组,我们使用reduce()将它们整理成一个对象。我们从空对象开始来做到这一点{}, 和, 对于每个元素k在键数组中,我们spread将先前的对象放入新对象中,并使用 key 添加新属性k.key和价值k.

请注意,类型newObject is Record<string, ObjectType1 | undefined>, using the Record<K, V>实用型。它有一个字符串索引签名;这意味着 TypeScript 编译器不知道什么键newObject实际上会的。仅此而已,对于每个键newObject, 财产value将是类型ObjectType1 | undefined。 (那undefined可能性就在那里,所以如果你写newObject.someKeyThatDoesNotActuallyExist编译器不会错误地声称存在类型的属性ObjectType1。你必须处理可能的情况undefined/缺少属性)。

好吧,我们来测试一下:

console.log(newObject.key1)
// { "key": "key1", "value": "value1" } 

看起来不错!

Playground 代码链接

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何创建一个新对象,其中键作为一个对象的值,该对象作为值? 的相关文章

  • TypeScript:增强内置类型

    如何增强其中一种 内置 类型 例如数组 在 JS 中 我会做类似的事情 Array prototype shuffle function TypeScript 中的等价物是什么 TypeScript 中的类型是 开放式 的 所以你可以这样写
  • 每 3 秒重复一次动画

    我正在使用 WOW js 和 animate css 现在我正在将 CSS 运行到 Infinite 我想知道如何让我的课程运行 3 秒停止并再次开始到无限 My html img src images fork png class for
  • rxjs/Subject.d.ts 错误:类“Subject”错误地扩展了基类“Observable

    我从中提取了示例模板代码本教程 https github com gopinav Angular 2 Tutorials并执行以下两个步骤来开始 npm install worked fine and created node module
  • 在 Vue.js 中从父组件执行子方法

    目前 我有一个 Vue js 组件 其中包含其他组件的列表 我知道使用 vue 的常见方式是将数据传递给孩子 并从孩子向父母发出事件 但是 在这种情况下 我想在子组件中的按钮出现时执行子组件中的方法 parent被点击 哪种方法最好 一种建
  • 如何重定向到 instagram://user?username={username}

    我的 html 页面上有这个链接 可以在特定用户上打开 Instagram 应用程序 a href Link to Instagram Profile a 我一直在寻找自动运行 url instagram user username USE
  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • Meteor:应用程序无法在 0.9.1.1 版本上运行

    出现类似错误 Error TypeError undefined is not a function evaluating Template create anonymous function iron dynamic template j
  • Google App Engine:修改云运行环境

    我正在尝试部署一个使用自定义 Node js 服务器的 Next js 应用程序 我想将自定义构建变量注入应用程序 next config js const NODE ENV process env NODE ENV const envTy
  • 标签获取 href 值

    我有以下 html div class threeimages a img alt Australia src Images Services 20button tcm7 9688 gif a div class text h2 a hre
  • Meteor - 从客户端取消服务器方法

    我正在通过服务器方法执行数据库计数 用户可以选择他们希望如何执行计数 然后调用该方法 我的问题是 计数可能需要一些时间 并且用户可能会在方法运行时改变主意并请求不同的计数 有什么方法可以取消调用的方法并运行新的计数吗 我认为 this un
  • 在javascript中解析json - 长数字被四舍五入

    我需要解析一个包含长数字的 json 在 java servlet 中生成 问题是长数字被四舍五入 当执行这段代码时 var s x 6855337641038665531 var obj JSON parse s alert obj x
  • 表单计算器脚本基本价格未加载 OnLoad

    我的表单中有一个计算器来计算我的下拉选项选择 function select calculate on change calc input type checkbox calculate on click calc function cal
  • 通过 CDN 使用 Dojo 时如何加载自定义 AMD 模块?

    我正在使用 google 的 CDN 并尝试使用他们的加载程序加载我自己的 AMD 模块 我知道我做错了什么 但我被困住了 有任何想法吗
  • Electron - 为什么在关闭事件时将 BrowserWindow 实例设置为 null

    The 电子文档 https electronjs org docs api browser window 提供以下代码示例来创建新窗口 const BrowserWindow require electron let win new Br
  • Javascript 数组到 VBScript

    我有一个使用 Javascript 构建的对象数组 我需要使用 VBScript 读取它 如下例所示 我找不到在 VbScript 代码中循环遍历数组的方法myArray object 这个例子是我的问题的简化 我无法更改页面的默认语言 这
  • Safari 支持 JavaScript window.onerror 吗?

    我有一个附加到 window onerror 的函数 window onerror function errorMsg url line window alert asdf 这在 firefox chrome 和 IE 中工作正常 但在 s
  • 如何更改此 jquery 插件的时区/时间戳?

    我正在使用这个名为 timeago 的插件 在这里找到 timeago yarp com 它工作得很好 只是它在似乎不同的时区运行 我住在美国东部 费城时区 当我将准确的 EST 时间放入 timeago 插件时 比如 2011 05 28
  • 如何仅在最后一个
  • 处给出透明六边形角度?
  • 我必须制作这样的菜单 替代文本 http shup com Shup 330421 1104422739 My Desktop png http shup com Shup 330421 1104422739 My Desktop png
  • 如何获取浏览器视口中当前显示的内容

    如何获取当前正在显示长文档的哪一部分的指示 例如 如果我的 html 包含 1 000 行 1 2 3 9991000 并且用户位于显示第 500 行的中间附近 那么我想得到 500 n501 n502 或类似的内容 显然 大多数场景都会比
  • 导致回发到与弹出窗口不同的页面

    我有一个主页和一个详细信息页面 详细信息页面是从主页调用的 JavaScript 弹出窗口 当单击详细信息页面上的 保存 按钮时 我希望主页 刷新 是否有一种方法可以调用主页的回发 同时还可以从详细信息页面维护保存回发 Edit 使用win

随机推荐

  • OpenMP 大大减慢了 for 循环速度

    我正在尝试通过 OpenMP 并行化来加速这个 for 循环 我的印象是这应该将工作分成多个线程 然而 也许开销太大 无法给我带来任何加速 我应该提到这个循环发生了很多很多次 并且循环的每个实例都应该并行化 循环迭代次数 newNx 可以小
  • 如何 db:seed 模型及其所有嵌套模型?

    我有这些课程 class User has one user profile accepts nested attributes for user profile attr accessible email password passwor
  • 仅使用 Javascript 将事件监听器添加到不存在的对象

    我搜索了整个 stackoverflow 但没有针对这个问题得到任何好的结果 如果我错了 请纠正我 我想向 DOM 中存在或不存在的对象添加EventListener 在Jquery中我们可以简单地执行以下代码 document on cl
  • aspnet core实体框架7自引用“作业”1对多表

    我有一个包含职位的 职位 表 事实上 工作并不总是一次性完成的 您可以拥有一份需要多次访问的工作 我打算将其表示为另一项工作 但通过自引用 linkId 链接回原始工作 我无法使用 Fluent API 来表示这一点 它是一对多的关系 一项
  • 有没有办法在没有 GUI 的情况下从特定行运行 MATLAB 脚本?

    有没有办法在不使用 GUI 的情况下从特定行运行 MATLAB 脚本 在 GUI 中我使用 Thanks 可以写入一个函数 该函数将读取脚本 m 文件 跳过行直到需要的行 并将其余行写入临时 m 文件 然后运行它 或者从 line1 到 l
  • Flutter 升级 Flutter 版本后运行 pod install 时出错

    flutter版本升级到最新的Flutter 2 2 1后 在ios模拟器上运行app时 运行pod install时报错 我尝试通过执行以下命令来清洁 Pod 但它没有解决问题 flutter clean flutter pub get
  • 将委托作为变量存储/传递

    我对 C 相当陌生 正在研究一种使用串行通信来实现动态 GUI 的方法 我是C出身 所以函数指针的概念很熟悉 基本上我想在处理串行命令时调用answerFunction 函数 理论上 我有一个类 lbl txtBox Pair 它是在运行时
  • 可以从服务中检测到后退按钮按下吗?

    可以从服务中检测到后退按钮按下吗 真的如标题所说吗 我已经做了很多谷歌搜索 但找不到明确的答案 也没有办法做到吗 可以从服务中检测到后退按钮按下吗 不 抱歉 如果您在前台有一个 Activity 该 Activity 可以检测到 BACK
  • WordPress - 向 wp_posts 添加额外的列,然后发布到其中

    我试图在 添加帖子 或 添加页面 中添加一个额外的字段 我将该字段的值插入到数据库中 wp posts 表中添加的手动添加的列中 我知道我可以使用自定义字段模板 但问题是这些自定义字段将值插入 wp postmeta 而不是 wp post
  • 从 StackPanel 中删除子项

    for int i 0 i lt stackPanel Children Count i stackPanel Children Remove stackPanel Children i int x stackPanel Children
  • 访问 HttpParams 的所有条目

    有没有一种方法可以迭代所有条目HttpParams object 其他人也有类似的问题 打印 HttpParams HttpUriRequest 的内容 但答案并没有真正起作用 当调查时基本Http参数我看到有一个HashMap里面 但无法
  • 在 virtualenv 中的 GPU 集群上运行 TensorFlow

    我按照这些在 virtualenv 中安装了 GPU 版本的张量流指示 问题是 我在启动会话时遇到分段错误 也就是说 这段代码 import tensorflow as tf sess tf InteractiveSession 退出并出现
  • Debian 没有名为 numpy 的模块

    我已经在 Debian 上安装了 Python Numpy 使用 apt get 安装 python numpy 但是当运行 Python shell 时 我得到以下信息 Python 2 7 10 default Sep 9 2015 2
  • @Injectable() 装饰器和提供者数组

    Injectable 装饰器中 root 中提供的服务是否仍然必须位于模块的提供者数组中 The 角度文档并没有真正给我答案或者我不太明白 在我的核心文件夹中 我有一个在根目录中提供的身份验证服务 我不想将我的核心模块导入到应用程序模块中
  • React 将历史记录传递给路由器中定义的组件

    我的 App js 中有这个路由器
  • 如何更改默认 backBarButtonItem 上的颜色/图像?

    我需要更改默认的 self navigationItem backBarButtonItem 的颜色 为了实现这一点 我创建了一个自定义 Button 类并按如下方式实现它 void viewDidLoad super viewDidLoa
  • MVC3 在重定向到操作时销毁会话

    我在 MVC3 应用程序中遇到会话问题 在一个控制器中 我收到一个发布请求 然后在重定向到控制器 get 方法之前将值添加到会话中 问题是 在 GET 请求中 会话值返回 null 即使在 POST 请求中设置了会话值 HttpPost p
  • 带有复选框问题的 jQuery 禁用按钮

    我有以下代码 在选中复选框时启用按钮 http jsfiddle net ERfWz 1 以下是我的 HTML 页面中的代码片段 它非常相似 但由于某种原因它不起作用 我想我可能已经看它太久了
  • SmoothState.Js 页面更改后重新初始化页面脚本

    我使用 SmoothState js 进行页面转换 它工作正常并使用 ajax 加载新页面 然而 我在每个页面上都有需要重新初始化的 JS 脚本 并且我无法让它们始终出现在页面转换中 根据常见问题解答 smoothState js 提供了
  • 如何创建一个新对象,其中键作为一个对象的值,该对象作为值?

    我的问题有点类似于this 我有一个映射 其键为 objectType1 值为 objectType1 无效的 type ObjectType1 key string value string const newMap new Map