通过比较两个键来连接两个json数组

Question

我不想通过比较每个数组中的两个字段来连接两个json数组（例如SQL join：请参见代码中的if），并将第二个数组中的值添加到第一个数组中。 我尝试通过使用嵌套循环来解决此问题，并将值从内部循环传递到外部循环（请参见代码）。 但是结果始终为0。

曼尼谢谢！

这是代码示例：

var dmNodeGraph = [ { id: 'marathonschaatsteams',
        group: '9',
        type: 'child',
        color: '33cccc' },
      { id: 'KNSB', group: '9', type: 'child', color: '33cccc' },
      { id: 'stationshuisje',
        group: '9',
        type: 'child',
        color: '33cccc' },
      { id: 'RTV', group: '9', type: 'child', color: '33cccc' },
      { id: 'wachten', group: '5', type: 'child', color: '99cc00' },
      { id: 'smartcards', group: '9', type: 'child', color: '33cccc' } ]

 var groupByLink =  [ { key: 'stationshuisje-kpn-9', values: 1 },
      { key: 'RTV-tele2-9', values: 14 },
      { key: 'Spelen-kpn-9', values: 13 },
      { key: 'hoofdsponsor-kpn-9', values: 14 },
      { key: 'schaatsen-kpn-9', values: 13 },
      { key: 'KNSB-kpn-9', values: 17 },
      { key: 'klanten-ziggo-9', values: 3 },
      { key: 'kaarten-ziggo-9', values: 1 },
      { key: 'wachten-ziggo-9', values: 1 },
      { key: 'marathonschaatsteams-kpn-9', values: 1 },
      { key: 'wachten-tele2-9', values: 1 },
      { key: 'gebruiken-kpn-9', values: 1 },
      { key: 'wachten-kpn-9', values: 1 },
      { key: 'abonnementen-kpn-9', values: 2 },
      { key: 'wachten-Glasvezel-5', values: 1 },
      { key: 'smartcards-ziggo-9', values: 2 } ]



 $('#test').append('This is from the loop <br>')
 for (var i = 0; i < dmNodeGraph.length; i++){
       var id  = dmNodeGraph[i].id
       var group = dmNodeGraph[i].group
       var value
            //$('#test').append('<br> ------------------- id: ' + id + ' group: ' + group + '--------------------'  )
       // 4.A.1.A Loop per Node through the grouped links
       for (var gl = 0 ; gl < groupByLink.length ; gl++){
         //value = 0
         var keys = groupByLink[gl].key.split('-')
         if (keys[0] == id && keys[2] == group){
           value = groupByLink[gl].values 

           // Location A 
           //$('#test').append('<br> id: ' + id + ' group: ' + group + ' values: ' + value ) 
         }
        }
                // Location B
          dmNodeGraph[i].values = value
          $('#test').append('<br> id: ' + id + ' group: ' + group + ' values: ' + value ) 
         }

该代码示例也可以在jsFidle（ https://jsfiddle.net/L67nwzs0/22/ ）中找到

Answer 1

删除赋值value=0 .//覆盖该值。

 var dmNodeGraph = [ { id: 'marathonschaatsteams', group: '9', type: 'child', color: '33cccc' }, { id: 'KNSB', group: '9', type: 'child', color: '33cccc' }, { id: 'stationshuisje', group: '9', type: 'child', color: '33cccc' }, { id: 'RTV', group: '9', type: 'child', color: '33cccc' }, { id: 'wachten', group: '5', type: 'child', color: '99cc00' }, { id: 'smartcards', group: '9', type: 'child', color: '33cccc' } ] var groupByLink = [ { key: 'stationshuisje-kpn-9', values: 1 }, { key: 'RTV-tele2-9', values: 14 }, { key: 'Spelen-kpn-9', values: 13 }, { key: 'hoofdsponsor-kpn-9', values: 14 }, { key: 'schaatsen-kpn-9', values: 13 }, { key: 'KNSB-kpn-9', values: 17 }, { key: 'klanten-ziggo-9', values: 3 }, { key: 'kaarten-ziggo-9', values: 1 }, { key: 'wachten-ziggo-9', values: 1 }, { key: 'marathonschaatsteams-kpn-9', values: 1 }, { key: 'wachten-tele2-9', values: 1 }, { key: 'gebruiken-kpn-9', values: 1 }, { key: 'wachten-kpn-9', values: 1 }, { key: 'abonnementen-kpn-9', values: 2 }, { key: 'wachten-Glasvezel-5', values: 1 }, { key: 'smartcards-ziggo-9', values: 2 } ] $('#test').append('This is from the loop <br>') for (var i = 0; i < dmNodeGraph.length; i++){ var id = dmNodeGraph[i].id var group = dmNodeGraph[i].group var value=0;//declare here //$('#test').append('<br> ------------------- id: ' + id + ' group: ' + group + '--------------------' ) // 4.A.1.A Loop per Node through the grouped links for (var gl = 0 ; gl < groupByLink.length ; gl++){ var keys = groupByLink[gl].key.split('-'); if (keys[0] == id && keys[2] == group){ value = groupByLink[gl].values // Location A //$('#test').append('<br> id: ' + id + ' group: ' + group + ' values: ' + value ) } } // Location B dmNodeGraph[i].values = value $('#test').append('<br> id: ' + id + ' group: ' + group + ' values: ' + value ); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id='test'> </div> 

Answer 2

如果您不想使用第三个变量，请尝试以下操作

dmNodeGraph.push.apply( dmNodeGraph, groupByLink );



console.log(dmNodeGraph) // contains both dmNodeGraph and groupByLink

Answer 3

您每次迭代都会将值初始化为0，并且最后一次聚合会丢失

 var dmNodeGraph = [ { id: 'marathonschaatsteams', group: '9', type: 'child', color: '33cccc' }, { id: 'KNSB', group: '9', type: 'child', color: '33cccc' }, { id: 'stationshuisje', group: '9', type: 'child', color: '33cccc' }, { id: 'RTV', group: '9', type: 'child', color: '33cccc' }, { id: 'wachten', group: '5', type: 'child', color: '99cc00' }, { id: 'smartcards', group: '9', type: 'child', color: '33cccc' } ] var groupByLink = [ { key: 'stationshuisje-kpn-9', values: 1 }, { key: 'RTV-tele2-9', values: 14 }, { key: 'Spelen-kpn-9', values: 13 }, { key: 'hoofdsponsor-kpn-9', values: 14 }, { key: 'schaatsen-kpn-9', values: 13 }, { key: 'KNSB-kpn-9', values: 17 }, { key: 'klanten-ziggo-9', values: 3 }, { key: 'kaarten-ziggo-9', values: 1 }, { key: 'wachten-ziggo-9', values: 1 }, { key: 'marathonschaatsteams-kpn-9', values: 1 }, { key: 'wachten-tele2-9', values: 1 }, { key: 'gebruiken-kpn-9', values: 1 }, { key: 'wachten-kpn-9', values: 1 }, { key: 'abonnementen-kpn-9', values: 2 }, { key: 'wachten-Glasvezel-5', values: 1 }, { key: 'smartcards-ziggo-9', values: 2 } ] $('#test').append('This is from the loop <br>') for (var i = 0; i < dmNodeGraph.length; i++){ var id = dmNodeGraph[i].id var group = dmNodeGraph[i].group var value=0; // initiallize with 0 for ever new iteration for (var gl = 0 ; gl < groupByLink.length ; gl++){ // value = 0 <-------- remove this one var keys = groupByLink[gl].key.split('-') if (keys[0] == id && keys[2] == group){ value += groupByLink[gl].values } } dmNodeGraph[i].values = value $('#test').append('<br> id: ' + id + ' group: ' + group + ' values: ' + value ) } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id='test'> </div> 

Answer 4

这是jsfiddle的工作版本。 我只是简单地取出了value变量，并直接在内循环内部使用了dmNodeGraph[i].values = groupByLink[gl].values 。

Answer 5

删除对value多余分配

 var dmNodeGraph = [ { id: 'marathonschaatsteams', group: '9', type: 'child', color: '33cccc' }, { id: 'KNSB', group: '9', type: 'child', color: '33cccc' }, { id: 'stationshuisje', group: '9', type: 'child', color: '33cccc' }, { id: 'RTV', group: '9', type: 'child', color: '33cccc' }, { id: 'wachten', group: '5', type: 'child', color: '99cc00' }, { id: 'smartcards', group: '9', type: 'child', color: '33cccc' } ] var groupByLink = [ { key: 'stationshuisje-kpn-9', values: 1 }, { key: 'RTV-tele2-9', values: 14 }, { key: 'Spelen-kpn-9', values: 13 }, { key: 'hoofdsponsor-kpn-9', values: 14 }, { key: 'schaatsen-kpn-9', values: 13 }, { key: 'KNSB-kpn-9', values: 17 }, { key: 'klanten-ziggo-9', values: 3 }, { key: 'kaarten-ziggo-9', values: 1 }, { key: 'wachten-ziggo-9', values: 1 }, { key: 'marathonschaatsteams-kpn-9', values: 1 }, { key: 'wachten-tele2-9', values: 1 }, { key: 'gebruiken-kpn-9', values: 1 }, { key: 'wachten-kpn-9', values: 1 }, { key: 'abonnementen-kpn-9', values: 2 }, { key: 'wachten-Glasvezel-5', values: 1 }, { key: 'smartcards-ziggo-9', values: 2 } ] for (var i = 0; i < dmNodeGraph.length; i++) { var id = dmNodeGraph[i].id var group = dmNodeGraph[i].group for (var gl = 0; gl < groupByLink.length; gl++) { var keys = groupByLink[gl].key.split('-') if (keys[0] == id && keys[2] == group) { var value = groupByLink[gl].values console.log(id + ', ' + group + ', ' + value) } } } 

Answer 6

groupByLink.map((e)=>dmNodeGraph.push(e))
console.log(dmNodeGraph);