合并具有公共元素和多个数据点的数组

2023-11-29

我正在尝试使用直接的 Javascript 将两个 Javascript 数组合并为一个数组。

我正在努力准确地完成以下两个问题中所提出的问题。然而,我的数据有几个点需要合并,而不是单个项目;并且数组之间有一个完全相同的公共元素。

以下是其他问题:

  1. 合并两个匹配 id 的数组
  2. JavaScript 按 id 合并对象

这是我的代码(来自上面列出的第一个问题提供的最后一个答案)(但显然是错误的):

let arr1 = [
            { route: 'x1' },
            { route: 'x2' },
            { route: 'x3' },
            { route: 'x4' },
            { route: 'x5' }
        ]


        let arr2 = [
            { pattern: 'y1', route: 'x1' },
            { pattern: 'y2', route: 'x1' },
            { pattern: 'y3', route: 'x2' },
            { pattern: 'y4', route: 'x2' },
            { pattern: 'y5', route: 'x3' },
            { pattern: 'y6', route: 'x3' },
            { pattern: 'y7', route: 'x4' },
            { pattern: 'y8', route: 'x4' },
            { pattern: 'y9', route: 'x5' },
            { pattern: 'y10', route: 'x5' }
        ]

        let finalArray2 = [];
        arr2.forEach(member => {
            finalArray2.push(Object.assign({}, member,
                { route: arr1.find(m => m.route === member.route).route }
            ))
        });

        console.log(finalArray2);

我确实需要如下所示的结果:

let arr3 = [
    { route: 'x1', pattern: ['y1','y2'] },
    { route: 'x2', pattern: ['y3','y4'] },
    { route: 'x3', pattern: ['y5','y6'] },
    { route: 'x4', pattern: ['y7','y8'] },
    { route: 'x5', pattern: ['y9','y10'] }
]

这样它就可以呈现在如下表中:

<style type="text/css">
.tg  {border-collapse:collapse;border-spacing:0;}
.tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;}
.tg .tg-yw4l{vertical-align:top}
</style>
<table class="tg">
  <tr>
    <th class="tg-yw4l">ROUTE</th>
    <th class="tg-yw4l">PATTERN(s)</th>
  </tr>
  <tr>
    <td class="tg-yw4l">x1</td>
    <td class="tg-yw4l">y1, y2</td>
  </tr>
  <tr>
    <td class="tg-yw4l">x2</td>
    <td class="tg-yw4l">y3, y4</td>
  </tr>
  <tr>
    <td class="tg-yw4l">x3</td>
    <td class="tg-yw4l">y5, y6</td>
  </tr>
  <tr>
    <td class="tg-yw4l">x4</td>
    <td class="tg-yw4l">y7, y8</td>
  </tr>
  <tr>
    <td class="tg-yw4l">x5</td>
    <td class="tg-yw4l">y9, y10</td>
  </tr>
</table>

你可以采取Map用于保留对目标对象的引用。

var array1 = [{ route: 'x1' }, { route: 'x2' }, { route: 'x3' }, { route: 'x4' }, { route: 'x5' }],
    array2 = [{ pattern: 'y1', route: 'x1' }, { pattern: 'y2', route: 'x1' }, { pattern: 'y3', route: 'x2' }, { pattern: 'y4', route: 'x2' }, { pattern: 'y5', route: 'x3' }, { pattern: 'y6', route: 'x3' }, { pattern: 'y7', route: 'x4' }, { pattern: 'y8', route: 'x4' }, { pattern: 'y9', route: 'x5' }, { pattern: 'y10', route: 'x5' }],
    routes = new Map,
    result = array1.map(o => (routes.set(o.route, {}), Object.assign(routes.get(o.route), o, { pattern: [] })));

array2.forEach(o => routes.get(o.route).pattern.push(o.pattern));

console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

合并具有公共元素和多个数据点的数组 的相关文章

  • 如何在没有 jQuery 的情况下删除 Javascript 中的元素

    我试图通过以下方式从 DOM 中删除 Div a 标签嵌套在其中 我想我正在寻找的是 jQuery 的纯 Javascript 版本 div remove 这是html设置 div a href Click me to remove the
  • 使用 Angular 指令禁用文本选择

    我正在学习 JavaScript 和 AngularJS 我想使用 Angular Directive 禁用文本选择 我有该函数的 JavaScript 代码 function clearSelection if document sele
  • 使用 Node.js 构建网站的最佳实践

    这个问题的答案是社区努力 help privileges edit community wiki 编辑现有答案以改进这篇文章 目前不接受新的答案或互动 我想知道如何使用 Node js 从头开始 开发一个网站 我明白我怎么能possibly
  • 在版本 4.4.6 中禁用 ckeditor 上下文菜单

    我在 Rails4 项目中使用 ckeditor 我尝试了 ckeditor gem 和 ckeditor rails gem 来提供 ckeditor 库 这里有多个帖子 人们希望删除 ckeditor 上下文菜单 以便可以显示本机浏览器
  • 想要动态处理与分页相关的页码显示:ReactJS

    我有一些分页逻辑工作得很好 唯一的问题是我只能让它显示并固定数量的页面可供选择 现在我已经把它放到了 5 页 但我希望它能够根据总记录动态更改 假设我有 100 条记录 每页限制为 10 条 将有 10 页 现在我只能让它以这种方式显示 第
  • 如何使用javascript确保元素仅在圆上朝一个方向移动?

    好吧 我承认我对三角学真的很糟糕 出于上下文的考虑 我将添加我在这里提到的问题中的内容 参考问题 https stackoverflow com a 39429290 168492 https stackoverflow com a 394
  • IntersectionObserver是否支持水平滚动观察?

    我制作了几个垂直滚动 IntersectionObserver 模块 但我对水平滚动感兴趣 根将是 div 观察目标将是 img 我想观察当 img 放大但 div 保持视口宽度时的变化 我什至不确定移动 Safari 是否会将缩放后的图片
  • React Router v4 不渲染组件

    React Router v4 渲染组件存在问题 在应用程序初始加载时 它将呈现与 URL 相对应的正确组件 但是 任何后续的组件Link单击不会呈现所需的组件 图书馆 反应路由器 4 2 2 https reacttraining com
  • 如何使用角度材料在具有可扩展行的表格中创建嵌套垫表

    我有以下数据 id c9d5ab1a subdomain wing domain aircraft part id c9d5ab1a info mimetype application json info dependent parent
  • 计算三次贝塞尔曲线的弧长、曲线长度。为什么不工作?

    我正在用这个算法计算弧长 三次贝塞尔曲线的长度 function getArcLength path var STEPS 1000 gt precision var t 1 STEPS var aX 0 var aY 0 var bX 0
  • onclick 事件中未调用函数

    我想在每个 YouTube 链接的末尾添加一些 HTML 以在 litebox 中打开播放器 到目前为止 这是我的代码 document ready function var valid url new RegExp youtube com
  • 传递给函数时多维数组的指针类型是什么? [复制]

    这个问题在这里已经有答案了 我在大学课堂上学习了 C 语言和指针 除了多维数组和指针之间的相似性之外 我认为我已经很好地掌握了这个概念 我认为由于所有数组 甚至多维 都存储在连续内存中 因此您可以安全地将其转换为int 假设给定的数组是in
  • 在 NumPy 中获取 ndarray 的索引和值

    我有一个 ndarrayA任意维数N 我想创建一个数组B元组 数组或列表 其中第一个N每个元组中的元素是索引 最后一个元素是该索引的值A 例如 A array 1 2 3 4 5 6 Then B 0 0 1 0 1 2 0 2 3 1 0
  • LeafleteachLayer函数不会迭代所有Layer

    使用 GeoJSON 数据数组创建一些标记 getJSON GetLocationsServlet function data L geoJSON data onEachFeature onEachFeature addTo mymap G
  • 从 pygame 获取 numpy 数组

    我想通过 python 访问我的网络摄像头 不幸的是 由于网络摄像头的原因 openCV 无法工作 Pygame camera 使用以下代码就像魅力一样 from pygame import camera display camera in
  • Highcharts jQuery 渲染问题 - 所有浏览器

    我在尝试使用构建堆积柱形图时遇到了一个奇怪的问题高图表 http www highcharts com 当图表呈现时 在您调整浏览器大小之前 不会显示列无论如何 导致图表重绘 我认为 图表的其余部分显示 轴 标题等 但不显示列本身 我在 I
  • 比较数组中的文件、从文本文件中删除行、函数、日志记录

    所以我创建了这两个数组 Approved Shares 和 Current Shares Reads Approvedshare txt and makes the txt file into an array public objFSO
  • 使用 next.js 进行服务器端渲染与传统 SSR

    我非常习惯 SSR 意味着页面得到完全刷新并从服务器接收完整 HTML 的方法 其中根据后端堆栈使用 razor pub other 进行渲染 因此 每次用户单击导航链接时 它只会向服务器发送请求 整个页面将刷新 接收新的 HTML 这就是
  • 仅当显式选择行时才关闭 ui-bootstrap typeahead

    我创建了这个jsBin http jsbin com livuqafe 2 edit来证明我遇到的问题 如果您转到此处 请尝试输入 五 并继续 你的自然反应是输入 五 然后按 Tab 如果你想要 五百 你可以向下箭头一次 但是 在这种情况下
  • 使用velocity.js制作可拖动元素的动画

    我正在使用velocity js 为用户拖动的可拖动 SVG 元素设置动画 然而 velocity js 将先前的 mousemove 坐标排队并通过所有后续的 mousemove 坐标进行动画处理 我想要的是velocity js 不要对

随机推荐

  • 如何查找 SQL Server 2005 的服务器名称

    我已经在我的系统上安装了 SQL Server 2005 安装后 当我尝试使用它时 它要求输入服务器名称 我努力了 SQLEXPRESS local local localhost localhost localhost computern
  • 如何在Excel中编辑通过宏代码显示的单元格中的信息?

    我有一个宏 这样当您突出显示sheet1上的一行时 该宏就会获取该行中的所有信息 并将其单独显示在sheet2上 如果突出显示sheet1上的不同行 sheet2上的信息将更改以显示该行的信息 我的问题是 如果我更改sheet2上显示的信息
  • Android gradle 3.0.0 - ZLIB 输入流意外结束

    将 android studio 更新到 3 0 并切换到gradle plugin 3 0 0我收到此错误 Gradle project refresh failed Error Unexpected end of ZLIB input
  • 张量流中的加权成本函数

    我试图将权重引入以下成本函数 cost tf reduce mean tf nn sparse softmax cross entropy with logits logits logits labels y 但不必自己做 softmax
  • fork()在for循环中执行

    int main int argc char argv int i 0 while i lt 2 fork system ps o pid ppid comm stat i return EXIT SUCCESS 谁能告诉我 ps 命令执行
  • Visual Studio 2012 上的 mySQL 数据源

    我一直在阅读有关 mySQL 数据源以及将 mySQL 与实体框架结合使用的能力 但如果不使用数据源对话框 我无法真正使用 mySQL 生成 EF 如何将 mySQL 数据库添加到此类对话框 这是我到目前为止所做的 已安装mySQL 连接器
  • 用于传递块的 Ruby 语法 [重复]

    这个问题在这里已经有答案了 为什么带大括号的语法按预期工作 class SomeClass include Parser Http new agent PASSED This block was passed to Http new end
  • 如何使用mockito verify()验证一个方法被调用两次

    我想通过mockito verify验证一个方法是否至少被调用一次 我使用了验证 它抱怨如下 org mockito exceptions verification TooManyActualInvocations Wanted 1 tim
  • 如何测试 IPC::Run3 的退出状态

    我正在尝试测试 Perl 模块 IPC Run3 但难以检查命令是否失败或成功 我知道如果 IPC Run3 的参数有问题 它会发出退出代码 但是如果参数没问题但命令不存在怎么办 我如何测试以下示例 有一个子程序来调用 Run3 sub r
  • 转换为 PHP REST CURL POST

    我们如何将此代码转换为 PHP REST CURL POST POST https apis live net v5 0 me skydrive files access token ACCESS TOKEN Content Type mu
  • 如何在 mac os x 10.7.2 Lion 上安装 PIL

    我尝试过谷歌搜索并查找其他人的问题 但是 我仍然找不到在 mac os x 10 7 2 Lion 上安装 PIL 适用于 python 2 6 或 2 7 的清晰 简单的方法 如果你使用homebrew 您只需安装 PILbrew ins
  • gnuplot 条形图上的 Y 值?

    我可以让 gnuplot 在其条形上显示数据点的精确 y 值或高度 使用 带框 绘制 吗 我希望该图易于阅读 这样就无需将条形顶部与 y 轴对齐并猜测该值是多少 您可以使用标签样式并将其与框样式结合到绘图命令中 标签样式需要 3 列数据 x
  • Oracle 中的 DATEDIFF 函数 [重复]

    这个问题在这里已经有答案了 我需要使用 Oracle 但 DATEDIFF 函数在 Oracle DB 中不起作用 在Oracle中如何编写以下代码 我看到一些使用 INTERVAL 或 TRUNC 的示例 SELECT DATEDIFF
  • 如何在张量流中使用预训练模型作为不可训练子网络?

    我想训练一个包含子网络的网络 我需要在训练期间保持修复 基本思想是在预训练网络 inceptionV3 中添加一些层 new layers gt pre trained and fixed sub net inceptionv3 gt ne
  • 根据第二个数组过滤 numpy 数组中的行

    我有 2 个 2d numpy 数组 A 和 B 我想删除 A 中出现在 B 中的所有行 我尝试过这样的事情 A np isin A B 但 isin 保留 A 的维度 我需要每行一个布尔值来过滤它 编辑 像这样的东西 A np array
  • Vue 模板或渲染函数尚未定义,我两者都没有使用?

    这是我的主要 JavaScript 文件 import Vue from vue new Vue el app 我的 HTML 文件 div div 使用运行时构建的 Vue js 的 Webpack 配置 alias vue vue di
  • 通过计时器在 JDialog 中设置动态 JLabel 文本

    我正在尝试制作一个 JDialog 它将在 JLabel 上向用户显示动态消息 该消息应该是从 1 到 10 的计数 并且应该每秒更改一个数字 问题是 当我调试它时 它在 dia setVisible true 之后立即停止 除非我关闭 J
  • 在 R 中提取日期

    我在 R 中处理日期方面遇到了很大的困难 而在 SPSS 中可以很轻松地做到这一点 但我很乐意留在 R 中完成我的项目 我的数据框中有一个日期列 想要完全删除年份以保留月份和日期 这是我的原始数据的峰值 gt head ds date 1
  • 在不改变宽度的情况下减少条之间的间距

    我正在创建一个像这样的条形图 gender M F numbers males females bars plt bar gender numbers width 0 1 bottom None align center data None
  • 合并具有公共元素和多个数据点的数组

    我正在尝试使用直接的 Javascript 将两个 Javascript 数组合并为一个数组 我正在努力准确地完成以下两个问题中所提出的问题 然而 我的数据有几个点需要合并 而不是单个项目 并且数组之间有一个完全相同的公共元素 以下是其他问