JS中如何获取对象数组的特定属性?

2024-04-02

我有以下代码和测试数据:

const getNestedObject = (nestedObj, pathArr) => {
    return pathArr.reduce((obj, key) => {
        return (obj && obj[key] !== 'undefined') ? obj[key] : undefined, nestedObj;
    });
}

const obj = 
 [
  {
      a: 1,
      c: [
        {
          d: 1,
          e: 'string',
          f: [
            {
              value: 0,
            },
            {
              value: 1,
            }
          ],
        },
      ],
  },
    {
      a: 2,
      c: [
        {
          d: 2,
          e: 'string',
          f: [
            {
              value: 3,
            },
            {
              value: 4,
            }
          ],
        },
      ],
  },
 ];

console.log(obj);
const fs = obj.map(o => getNestedObject(o, ['c', 'f']));
console.log(fs);

我想要做的是给出如下所示的对象数组,我只想获取名为的属性f来自数组中的每个对象。所以,基本上最终结果应该是数组f每个对象的值。由于“f”是一个数组,我非常希望最终结果只是一个包含所有“f”属性中的元素的数组,因此每个“f”都会分散开来,所以我有一个数组。我的上面getNestedObject功能似乎不起作用,因为当console.log下面的语句返回整个对象。有什么想法如何在 JS 中做到这一点吗?

所以基本上最终结果应该是:

[{ value: 0 }, { value: 1 }, { value: 3 }, {value: 4 }]

你可以结合reduce() with map()。基本上将您的主数组减少为所有数组的扁平数组c.f项目。这会检查c属性以防万一对象没有它:

const obj = [{a: 1,c: [{d: 1,e: 'string',f: [{value: 0,},{value: 1,}],},],},{a: 2,c: [{d: 2,e: 'string',f: [{value: 3,},{value: 4,}],},],},];

let Fs = obj.reduce((arr, item) => 
    item.c
    ? arr.concat(...item.c.map(itemc => itemc.f ))  // concat for flattened rather than nested arrays
    : arr
    , []);

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

JS中如何获取对象数组的特定属性? 的相关文章

  • 显示和随机化 php 数组

    我有一个显示结果的数组 如下所示 Array 0 gt 71 1 gt 56 2 gt 64 3 gt 82 4 gt 90 5 gt 80 6 gt 65 7 gt 62 8 gt 14 9 gt 3 我的代码是 while row my
  • 我可以动态创建/销毁 Vue 组件吗?

    因此 我正在创建一个相当复杂的 Vue 应用程序 它从后端 API 获取数据并将其显示在前端 具体取决于用户选择的过滤器 它的默认设置是立即显示所有内容 然后一旦用户选择过滤器 它就会拉出不具有这些属性的 卡片 组件 直到今天 一切都很顺利
  • 为什么隐式符号到字符串转换会导致 JavaScript 中出现类型错误?

    有一个 toString on Symbol在 ES6 中 它返回字符串表示形式Symbol 但想知道为什么 Symbol 不起作用 运行这个表达式会抛出TypeError我没想到 后者只是打电话吗 toString 在一个新的Symbol
  • JavaScript - 无需布尔值即可运行一次

    有没有办法只运行一段JavaScript代码ONCE 而不使用布尔标志变量来记住它是否已经运行过 具体来说not就像是 var alreadyRan false function runOnce if alreadyRan return a
  • 如何使用 JavaScript 选择预节点/块中的文本?

    我了解不允许 JS 将任意文本复制到剪贴板背后的安全原因 但是是否有一种方法可以通过单击按钮来选择预节点中的文本 类似于 select 函数在输入中的工作方式 我不是在寻找复制到剪贴板的 jQuery 插件 我只想突出显示预块中的文本 以便
  • 递归修剪对象中所有元素的更好方法?

    如果我有一个像这样的物体 const obj field subfield innerObj a asdasd asdas innerArr s ssad innerArrObj b adsad 我想出了这样的东西 const trimFi
  • React 应用程序中的 addEventListener 不起作用

    一些背景 我正在尝试消费自定义网络组件在 React 应用程序中并尝试监听来自 Web 组件的事件 我相信您不能只在自定义 Web 组件上以通常的反应方式处理事件 i e
  • 限制 Dropzone 仅上传特定类型的文件

    我正在使用 Dropzone 上传文件 这是我的代码 div div
  • 为什么我们使用 SpreadsheetApp.flush()?

    我的理解是 flush https developers google com apps script reference spreadsheet spreadsheet app flush有助于在功能发生时执行这些功能 而无需将它们捆绑在
  • setInterval() 在用户离开选项卡时暂停?

    javascript 中是否有任何方法的行为类似于 setInterval 并且当用户离开选项卡时停止并在用户再次进入选项卡时恢复 您可以使用以下方法创建自己的 API可见性API https developer mozilla org e
  • 合并 2 个数组并合并数字键的结果

    我有 2 个数组 我希望通过每个数字键将其中合并 分组在一起 例如 Array1 2009 gt 131 2008 gt 940 2007 gt 176 2006 gt 1 Array2 2008 gt 9 2007 gt 3 我希望输出是
  • “|”是什么意思(单管道)在 JavaScript 中做什么?

    console log 0 5 0 0 console log 1 0 1 console log 1 0 1 为什么0 5 0返回零 但任何整数 包括负数 都返回输入整数 单管道 有什么作用 这是一个按位或 https developer
  • 如何在 javascript 中基于类型字符串创建新对象?

    如何基于变量类型字符串 包含对象名称 在 javascript 中创建新对象 现在我有 随着更多工具的出现 列表会变得更长 function getTool name switch name case SelectTool return n
  • 尝试使用 Firebug 查找 JavaScript 文件中的函数

    我试图找到这个函数调用 myFooBar 该函数在某些 HTML 中内联引用 但页面加载了大量 JavaScript 并且在每个文件中搜索该函数需要相当多的工作 如何使用 Firebug 找到此函数所在的 JavaScript 文件 打开脚
  • 不使用控件时,视频元素在 Chrome 中消失

    So I think这是一个浏览器错误 它出现在一个更复杂的设计 网站中 但我已经进行了很好的尝试 简化了我的代码和设计等 并发现了以下内容 嵌入时
  • Javascript onload 不起作用[关闭]

    这个问题不太可能对任何未来的访客有帮助 它只与一个较小的地理区域 一个特定的时间点或一个非常狭窄的情况相关 通常不适用于全世界的互联网受众 为了帮助使这个问题更广泛地适用 访问帮助中心 help reopen questions 我正在使用
  • 弹出窗口的动态高度取决于内容,可能吗?

    是否有可能获得一个宽度始终为 400px 的弹出窗口 但根据弹出窗口中的内容动态高度 我已经看到了这个 但不知道如何将其应用到弹出窗口 调整 iframe 的宽度高度以适应其中的内容 https stackoverflow com ques
  • 检测浏览器选项卡是否具有焦点

    是否有可靠的跨浏览器方法来检测选项卡是否具有焦点 场景是 我们有一个定期轮询股票价格的应用程序 如果页面没有焦点 我们可以停止轮询并为每个人节省流量噪音 特别是当人们喜欢打开具有不同投资组合的多个选项卡时 Is window onblur
  • p5 向量减法“sub”返回错误

    我一直在尝试将 p5 草图上传到 React 构建中 使用react p5 wrapper 我能够成功在屏幕上渲染画布 但是 某些矢量函数会导致错误 var distance this position dist ball position
  • JQuery 删除和内存泄漏

    我正在开发一个游戏 我看到了很多内存消耗 我使用jquery animate 动画完成后 我 remove 元素 我的问题是 从 dom 树中删除一个元素后 对象还存在记忆中吗 Javascript 是一种垃圾收集语言 这意味着当没有代码保

随机推荐

  • 如何为 php 安装 hiphop?

    大多数开发人员都了解 Facebook 的 Hiphop for php 我想在我的脚本中使用它 但不知道从哪里开始 我应该与我的服务器提供商联系吗 或者我需要在脚本中添加一些代码吗 HipHop 很难安装 但幸运的是我刚刚经历过它 您需要
  • 相当于 Python 中 Julia 中的“with”?

    Julia 有与 Python 相当的东西吗 with 也许作为一个宏 这非常有用 例如 自动关闭打开的文件 Use a do堵塞 关于 do 块的文档是here https en wikibooks org wiki Introducin
  • 使用 VSTO 将数据加载到 Microsoft Project 时如何提高性能

    背景 我们有一个现有的应用程序 可以将数据加载到 Microsoft Project 中 以便可以由 MS Project 进行操作 原始应用程序是由 VB6 编写的旧式 COM 项目加载项 针对 MS Project 2003 2007
  • 启用 SSL 刷新 URL 时出现 React-router 问题

    目前 我在使用 React router 的 BrowserHistory 和 nginx 代理转发请求时遇到问题 我读过以下答案 React router url 在刷新或手动写入时不起作用 https stackoverflow com
  • Ninject:每个被拦截的类实例有一个拦截器实例?

    我目前遇到一个问题 尝试为每个被拦截的类实例连接一个拦截器实例 我正在 InterceptorRegistrationStrategy 中创建 Advice 并设置回调以解析来自内核的拦截器 它有一个注入构造函数 请注意 我只能在回调中实例
  • 即使没有来自客户端的连接,选择器也会无限循环

    我是 Java NIO 的新手 在阅读了一些教程后 我尝试自己编写一个简单的 NIO 服务器和客户端 我的服务器只做了一件简单的事情 就是从客户端监听并打印到控制台 客户端只需连接到服务器并向其发送 3 条消息 Hello 问题是我的服务器
  • .NET / C# 拼写检查器

    有人知道 C NET 的多语言拼写检查器吗 我的意思是 我有它和我找到了一些替代方案 但是有人有一个很好的成功故事吗 我需要在我的应用程序中添加拼写检查器 我想要一个集成的库System Windows Forms TexBox 例如 另外
  • 使用 std::codecvt_xxx 将 C++ std::wstring 转换为 utf8

    C 11有转换宽字符字符串的工具std wstring从 到 utf8 表示 std codecvt std codecvt utf8 std codecvt utf8 utf16 etc Windows 应用程序可使用哪一个来转换常规宽字
  • C++ 向量大小类型

    我刚刚开始学习 C 有一个关于向量的问题 我正在读的书指出 如果我想提取 double 类型向量的大小 例如 我应该这样做 vector
  • 为什么不能在 switch 语句中声明变量?

    我想了解更多关于 为什么不能在 switch 语句中声明变量 https stackoverflow com questions 92396 why cant variables be declared in a switch statem
  • 显示为“n”、“p”或“f”的小数字

    我正在使用绘图来绘制一些数据 小数字 我看到奇怪的格式 例如78 98p 576 65n 678 76f 这些F是什么 没有任何地方解释这些是什么 我怎样才能把它们变成带有 E 的科学记数法 看到这个https plot ly python
  • Visual Studio 代码:缺少 X509Certificate2UI

    尝试使用时出现以下错误X509Certificate2UI在 VS 代码中 命名空间 System Security Cryptography X509Certificates 中不存在类型或命名空间名称 X509Certificate2U
  • 递归的优点和缺点是什么?

    关于在排序算法中使用递归而不是非递归方法 或者就此而言 任何算法的优点和缺点是什么 大多数情况下 递归速度较慢 并且占用更多堆栈 递归的主要优点是 对于像树遍历这样的问题 它使算法变得更容易或更 优雅 看看一些比较 link http pa
  • Oracle 是否存储 Number 数据类型的尾随零?

    当我在表中存储数值并在 SQL Developer 中查询该表时 它没有显示数字数据类型的尾随零 create table decimal test decimal field number 10 insert into decimal t
  • 使用强化学习训练神经网络

    我了解前馈神经网络的基础知识 以及如何使用反向传播算法训练它们 但我正在寻找一种可以用于通过强化学习在线训练 ANN 的算法 例如 车杆向上摆动 http www google com search q cart 20pole 20swin
  • 带有子项的 ViewComponents

    我可以在这样的页面中使用 ViewComponents 吗
  • 将 CSV 数据导入 Google 表格

    当尝试使用IMPORTDATA该文件的函数 https www kaggle com stefanoleone992 fifa 20 complete player dataset players 20 csv https www kagg
  • JSF 获取托管 bean 中的当前操作

    当用户点击任意一个commandButton 然后在托管bean中调用相应的操作 是否可以从以下位置获取此操作名称 PostConstruct方法还是来自事件监听器方法 按钮的名称 值对本身可作为 HTTP 请求参数以通常的方式使用 想象一
  • 为什么我的 MVC3 Intranet 站点 Windows 身份验证在发布时不起作用

    我们有一个使用 MVC3 和实体框架的简单 Intranet 站点 一切正常 可以在 Visual Studio 中进行调试 当我将站点发布到本地盒子 IIS7 5 Web 服务器或同一域上的开发盒子时 系统会提示我输入用户名和密码 但它不
  • JS中如何获取对象数组的特定属性?

    我有以下代码和测试数据 const getNestedObject nestedObj pathArr gt return pathArr reduce obj key gt return obj obj key undefined obj