搜索深度嵌套数组以更新对象

2024-05-17

我有一个深层嵌套的数据结构,我有兴趣匹配数组(和数组数组)中的某个值,然后将一些数据推送到随附的数组中。例如以下是我的数组colors并伴随着的是更多颜色数组可能存在也可能不存在:

var myData = [{
    "color": "green",
    "moreColors": [
        {
            "color": "beige"
        },
        {
            "color": "black",
            "moreColor": [
                {
                    "color": "grey"
                },
                {
                    "color": "white",
                    "moreColors": [...]
                }
            ]
        }
    ]
}]

我有兴趣在数组中搜索颜色值grey并向该对象添加 moreColors 数组moreColors: [{"color" : "blue"}] 。在某些情况下,这可能会使用push()方法(如果数组已经存在)。我怎样才能最好地实现这一目标?我的目标是添加值并更新/变异myData这里是数组,因为这将被传递给另一个函数。这里的嵌套可能有几层深度,因此循环内的简单循环将不起作用。递归函数在这里效果最好吗?我也愿意接受更好的方法或使用类似的库下划线 or lodash。虽然我更喜欢普通的 js 版本。下面是我开始的一个递归解决方案,但是,代码的运行深度不会超过一个级别。

findNested(myData, "grey")

function findNested(myArray, color) {
    myArray.moreColors?.forEach(element => {
        if(element.color !== color){
            if(element.moreColors.length > 0) {
                findNested(element.moreColors, color);
            }
        } else {
                element.moreColors.push({
                    "color": "blue"
                });
        }
    });
}


这是我认为您正在尝试的一个简单示例。

findNestedColorObject()接受一个数组和一个要搜索的颜色字符串,并返回第一个对象color属性匹配。

updateMoreColors()接受上面返回的对象并首先分配moreColors如果不存在,则推送到数组。

function findNestedColorObject(array, color) {
  let colorObject;

  for (const obj of array) {
    if (obj.color === color) {
      colorObject = obj;
    } else if (obj.moreColors !== undefined) {
      colorObject = findNestedColorObject(obj.moreColors, color);
    }

    if (colorObject !== undefined) {
      break;
    }
  }

  return colorObject;
}

function updateMoreColors(colorObject, colors) {
  colorObject.moreColors ??= [];
  
  for (const color of [].concat(colors)) {
    colorObject.moreColors.push({ color });
  }
}

const myData = [{ "color": "green", "moreColors": [{ "color": "beige" }, { "color": "black", "moreColors": [{ "color": "grey" }, { "color": "white", "moreColors": ["ochre"] }] }] }];

const greyObject = findNestedColorObject(myData, 'grey');
console.log('found:')
console.log(greyObject);

updateMoreColors(greyObject, 'purple');
console.log('updated:');
console.log(greyObject);

const beigeObject = findNestedColorObject(myData, 'beige');
console.log('found:')
console.log(beigeObject);

updateMoreColors(beigeObject, ['salmon', 'crimson']);
console.log('updated:');
console.log(beigeObject);

// edit per the commments
const data = [{ color: "beige", moreColors: [{ color: "blue" }] }, { color: "black", moreColors: [{ color: "white" }] }];
const blue = findNestedColorObject(data, 'blue');
console.log('fixed overwrite error:')
console.log(blue);

或者,由于您尝试似乎在同一函数中搜索和更新,因此您可以组合上面的两个函数。 (这将继续更新所有匹配的对象,而不仅仅是第一个)。

function updateNestedColorObject(array, color, moreColors) {
  for (const obj of array) {
    if (obj.color === color) {
      obj.moreColors ??= [];
      for (const color of [].concat(moreColors)) {
        obj.moreColors.push({ color });
      }
    }
    if (obj.moreColors !== undefined) {
      updateNestedColorObject(obj.moreColors, color, moreColors);
    }
  }
}

const myData = [{ "color": "green", "moreColors": [{ "color": "beige" }, { "color": "black", "moreColors": [{ "color": "grey" }, { "color": "white", "moreColors": ["ochre"] }] }] }];

updateNestedColorObject(myData, 'grey', 'purple');
updateNestedColorObject(myData, 'purple', 'beige');
updateNestedColorObject(myData, 'beige', ['salmon', 'crimson']);

console.log(myData);

Edit

正如评论中指出的,我的第一个findNestedColorObject没有像成功搜索时那样退出循环。尽管可能有更干净的解决方案,但仍应用了快速修复。

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

搜索深度嵌套数组以更新对象 的相关文章

  • 使用javascript滚动滚动条或鼠标滚轮后触发事件

    我想知道是否可以触发事件after使用滚动条或鼠标滚轮 或在触摸设备上滑动 时滚动页面 基本上 我想检测用户何时停止滚动 以便我可以进行 AJAX 加载 而不是在滚动时加载 看起来jQuery s scroll 每次用户滚动时都会触发 并且
  • 为什么 Promise `.then` 方法的回调是反模式

    我在 StackOverflow 上看到了答案 人们建议为 AngularJS 服务提供回调函数 app controller tokenCtrl function scope tokenService tokenService getTo
  • 玉石压痕错误

    因此 对于我的 Express 网站 我使用 jade 所以我决定尝试修改我的布局文件 以便我可以开始设计我的网站 我修改了原始布局代码 有效 但我开始在任何扩展布局的文件中出现缩进错误 如下所示 500 Error home kevin
  • ActiveRecord 嵌套 SELECT——我可以在没有手动 SQL 的情况下完成它吗?

    我有一张桌子 上面有 除其他外 一个名字和一个等级 我想返回所有唯一名称的集合 但对于返回的每个名称 我想选择排名最高的行 这很简单 有两个嵌套的 SELECT 语句 SELECT FROM SELECT FROM foo ORDER BY
  • 解释一下这个令人困惑的 dojo 教程声明语法

    我正在阅读使用的语法道场的声明 http dojotoolkit org documentation tutorials 1 8 declare 用于班级创建 描述很混乱 The declare function is defined in
  • 无需重定向的 HTML 页面提交

    有没有什么方法可以在不使用ajax的情况下提交html表单而无需从当前页面重定向 你可以设置一个target 为您form 这样您就可以将表单提交到新选项卡 target blank 或一个小的 隐藏的iframe target nameo
  • 指定 HTML5 输入类型 = 日期的值输出?

    我想将本机日期选择器添加到我的应用程序中 该应用程序当前使用遗留的本地系统 日期输入支持尚未广泛普及 但如果我可以基于兼容性提供这两种实现 那就太理想了 有没有办法指定 HTML 日期选择器给出的值的输出 歌剧的默认设置是yyyy mm d
  • 插件 gulp-babel 错误:插件/预设文件不允许导出对象,只能导出函数

    我现在尝试在我的 Ionic v1 应用程序中使用 JavaScript 2015 ES6 包 json name test version 1 0 0 dependencies ionic native deeplinks 4 18 0
  • 如何在单击按钮时清除反应挂钩中的间隔

    我正在用反应钩子构建一个简单的计时器 我有两个按钮启动和重置 当我单击开始按钮时 handleStart 函数工作正常 计时器启动 但我不知道如何在单击重置按钮时重置计时器 这是我的代码 const App gt const timer s
  • 公开闭包内的方法

    当我们在闭包内创建一个方法时 该方法将成为该闭包的私有方法 并且在我们以某种方式公开它之前无法访问它 怎么可能暴露呢 您可以返回对它的引用 var a function var b function I m private alert go
  • 等待异步 grunt 任务完成

    我收到了 grunt 设置 其中一个新任务应该执行 grunt task run 已经存在的任务 要执行的任务是异步的 新任务应该等待异步任务完成 执行此操作的首选方法是什么 grunt 已经涵盖了这一点 你应该将你的任务声明为异步任务 并
  • 如何连接以逗号分隔的命名范围的返回值

    我花了几个小时试图找出如何连接命名范围中的返回值 但结果是 运行时错误 32 类型不匹配 作为一个新手 我仍在与数组作斗争 所以也许我忽略了一些细节 谢谢你帮助我 示例 B1 苯 B2 柴油 B3 混合动力 gt E1 汽油 E2 柴油 E
  • 如何让php页面从html页面接收ajax post

    我有一个非常简单的表单 其中有一个名字输入字段 我捕获了表单数据 并使用标准 jQuery 发布方法通过 ajax 将其传输到 PHP 页面 但是 我根本无法从 PHP 页面获得任何在服务器端捕获数据的响应 我不确定我做错了什么或缺少什么
  • 为什么 TypeScript 混合了模块和原型模式?

    我正在查看此页面上 TypeScript 生成的 JS 代码 http www typescriptlang org Playground http www typescriptlang org Playground 基本上 要创建一个Gr
  • chrome 选项卡/窗口中的 window.open 行为

    我有一小段 javascript 旨在打开两个或更多选项卡 这在 FF 和 IE 中工作正常 但 chrome 会在新窗口而不是选项卡中打开第二个窗口 它不依赖于 url 因为我已经尝试过使用两个相同的 url 第一个在选项卡中打开 第二个
  • Firebase 身份验证和实时应用程序数据库如何保护自身安全?

    从一般开发的角度来看 我很好奇如何保护在线资源的访问 我们使用以下 Firebase 配置参数初始化 Web 应用程序 apikey authdomain projectid databaseurl messagesenderid 服务器如
  • jQuery UI 对话框 - 关闭后无法打开

    我有一个问题jquery ui dialog box https jqueryui com dialog 问题是 当我关闭对话框然后单击触发它的链接时 除非刷新页面 否则它不会再次弹出 如何在不刷新实际页面的情况下回调对话框 下面是我的代码
  • 使用严格模式编译指示时如何声明全局变量

    使用自调用函数来包装严格模式兼容代码 通常称为严格模式编译指示 被认为是一种很好的做法 function use strict Strict code here 我的问题是在这种情况下如何声明全局变量 我今天知道的三种替代方案 替代方案 1
  • 在引导程序中以编程方式更改选项卡窗格选项卡

    我使用的选项卡窗格定义为 ul class nav nav tabs li a href personal Personal Information a li li class active a href contact Contact a
  • 使用 numpy 加速 for 循环

    下一个 for 循环如何使用 numpy 获得加速 我想这里可以使用一些奇特的索引技巧 但我不知道是哪一个 这里可以使用 einsum 吗 a 0 for i in range len b a numpy mean C d e f b i

随机推荐

  • shell脚本中的\r字符

    我在尝试执行 shell 脚本时收到以下错误 r command not found line 2 请提出同样的解决方案 以下是脚本中使用的初始行 bin sh if lt 1 then echo ERROR Environment arg
  • 增加 WPF 弹出动画的持续时间

    我有一个 WPF PopUp 控件 用于显示菜单叠加层 并且使用默认的淡入淡出动画 不过我想让动画需要更长的时间才能完成 我可以在 XAML 中做到这一点吗 你能在这里发布相关的xaml代码吗 否则 您可以查看这些链接以开始使用 xaml
  • 未捕获的异常“Google_IO_Exception”,消息为“HTTP 错误:无法连接”

    我有一个任务 查询 运行一些从 gmail 邮箱检索数据的 php 代码 直到上周五 2015 年 4 月 10 日 它一直工作正常 现在我收到以下错误日志 E 11 58 26 094 2015 04 15 200 3 38 KB 14
  • 如何在 Sails.js 中正确抛出和处理 Promise 中的错误?

    我开始将回调代码转换为 Sails js 中的承诺 但我不明白如何引发自定义错误并在承诺链中处理它们 Sails js 使用 Q 作为其 Promise 库 User findOne email req param professorEma
  • Python中列表中两个连续元素的平均值

    我有一个偶数个浮点数的列表 2 34 3 45 4 56 1 23 2 34 7 89 我的任务是计算 1 和 2 个元素 3 和 4 5 和 6 等元素的平均值 在 Python 中执行此操作的快捷方法是什么 data 2 34 3 45
  • 在docker容器中运行Jenkins有什么优势

    我发现了很多关于如何运行你的博客Jenkins in Docker但没有人真正解释这样做的好处 这是我发现的唯一原因 使用 Docker 的理由 https twasink net 2016 08 01 setting up a jenki
  • java异常处理策略[关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 在azure pipelines yaml脚本中使用运行时表达式

    我试图通过从天蓝色管道传递变量来执行脚本 这是我的简单测试管道 trigger master pool vmImage windows latest variables major 1 2 minor counter variables m
  • Kotlin 未解决的参考:CLI 上 gradle 的 println

    放一个printlnkotlin 函数返回之前的语句会崩溃 堆栈跟踪 thufir dur NetBeansProjects kotlin thufir dur NetBeansProjects kotlin gradle clean bu
  • 从正则表达式对象中提取允许字符串的最大长度

    一旦加载到 C 中 是否可以从正则表达式模式中提取允许的字符串的最大长度Regex object 如果我有一个正则表达式字符串定义为 A Z0 9 0 20 我可以使用字符串操作来获取最大允许长度20 但是 有没有一种方法可以更轻松地实现这
  • 根据 Pandas 中的列表对多列进行排序

    感谢有关如何根据 pandas 中的倍数列表对给定多列进行排序的任何提示 如下所示 import pandas as pd sort a a d e sort b s1 s3 s6 sort c t1 t2 t3 df pd DataFra
  • 如何根据运行的 jar 的结果让我的 ant 任务通过或失败?

    我正在运行 CrossCheck 无浏览器 js 单元测试 作为 ant 脚本的一部分 如果 CrossCheck 测试失败 我希望 ant 报告失败 这是 build xml 中的相关部分
  • 使用PHP套接字发送和接收数据

    我正在尝试通过 PHP 套接字发送和接收数据 一切正常 但是当我尝试发送数据时 PHP 不发送任何内容 Wireshark 告诉我发送的数据长度为 0 我正在使用这段代码
  • 如何更新 pl/sql 中嵌套表的列? [复制]

    这个问题在这里已经有答案了 我正在尝试在表中创建一个可以存储多个值的列 如下所示 我有一个学生id std和一个名为marks可以采用几个值 例如2 3 4 我想更新此列表以添加另一个标记2 3 4 5但我不知道怎么做 我如何更新专栏mar
  • 加快 ImageView 中的缩放功能

    我目前正在处理非常大的图像 7 10mb 由于多种原因无法调整大小或压缩 现在 我们的想法是在自定义 ImageView 中显示它们 使用户能够进行双击缩放 捏合缩放等 我使用这个库来完成这项工作 https github com Mike
  • Android 改变 ImageView / Bitmap 的颜色

    我需要找到一种方法来改变 Android 中位图的颜色 我需要在我的应用程序中平滑地替换 更改椭圆形图像的颜色 具体取决于int价值 我需要类似的东西myValue 5比改变我的图像的颜色RED and if myValue 322将颜色更
  • 如何动态突出显示网页上的字符串?

    我想创建带有 url 的页面 例如 http xyzcorp schedules 2015Aug24 Aug28 Jim Hawkins http xyzcorp schedules 2015Aug24 Aug28 Billy Bones
  • 如何在android中的操作栏中创建Edittext?

    我们可以在操作栏中使用编辑文本吗 在阅读了 Google 中的大量资源后 我找不到如何在操作栏中创建编辑文本 谁能告诉我该怎么做 您可以设置自定义View为了ActionBar像这样 getActionBar setCustomView R
  • IIS 8.5 MVC5 客户端缓存被忽略

    TL DR 我希望服务器 IIS 8 5 返回 304 未针对 CSS 和 JS 包进行修改 我无法让 IIS 8 5 遵守 web config 中的 clientCache 设置 无论我做什么 我似乎都无法让它缓存静态内容 这是VS20
  • 搜索深度嵌套数组以更新对象

    我有一个深层嵌套的数据结构 我有兴趣匹配数组 和数组数组 中的某个值 然后将一些数据推送到随附的数组中 例如以下是我的数组colors并伴随着的是更多颜色数组可能存在也可能不存在 var myData color green moreCol