Question

我需要一些相当简单但具有挑战性（对我来说）编程任务的帮助。

有两个数组对象，一个是长对象：

var arrayShort = [
  {
    id: 'A',
    name: 'first'
  },{
    id: 'B',
    name: 'second'
  },{
    id: 'C',
    name: 'third'
  }
]

var arrayLong = [
  {
    id: 'A',
    name: 'firstSub1'
  },{
    id: 'A',
    name: 'firstSub2'
  },{
    id: 'A',
    name: 'firstSub3'
  },{
    id: 'B',
    name: 'secondSub1'
  },{
    id: 'B',
    name: 'secondSub2'
  },{
    id: 'B',
    name: 'secondSub3'
  },{
    id: 'C',
    name: 'thirdSub1'
  },{
    id: 'C',
    name: 'thirdSub2'
  },{
    id: 'C',
    name: 'thirdSub3'
  }
]

如何根据共享ID将它们合并在一起以获得以下内容：

var arrayCombined = [
  {
    id: 'A',
    name: 'first'
  },{
    id: 'A',
    name: 'firstSub1'
  },{
    id: 'A',
    name: 'firstSub2'
  },{
    id: 'A',
    name: 'firstSub3'
  },{
    id: 'B',
    name: 'second'
  },{
    id: 'B',
    name: 'secondSub1'
  },{
    id: 'B',
    name: 'secondSub2'
  },{
    id: 'B',
    name: 'secondSub3'
  },{
    id: 'C',
    name: 'third'
  },{
    id: 'C',
    name: 'thirdSub1'
  },{
    id: 'C',
    name: 'thirdSub2'
  },{
    id: 'C',
    name: 'thirdSub3'
  },
]

重要

订单很重要。

我尝试了什么

for (var i = 0; i < arrayShort.length; i++) {
  var itemShort = arrayShort[i]
  console.log(itemShort)
  for (var j = 0; j < arrayLong.length; j++) {
        var itemLong = arrayLong[j]
    if (itemLong.id === itemShort.id) {
      console.log(itemLong)
      arrayShort.splice(j + 1, 0, arrayLong)
    }
  }
}


var arrayCombined = arrayShort
console.log(arrayCombined)

这导致无限循环，但我不确定为什么。一般来说，我知道嵌套循环和条件是坏消息。

有什么方法可以解决这个问题（精神上，使用代码等）？

Here's a Codepen，打开开发工具查看

注意：

Vanilla Javascript解决方案更受青睐，但看到使用Lodash或Underscores进行此操作的方法也很好。一般来说，我觉得这两个图书馆中的任何一个都可以让这类任务变得非常容易，但我似乎无法理解如何。
尝试为此找到合适的搜索字词非常困难...建议？

感谢您的反馈/见解。

Answer 1

concat和sort是你的朋友

var arrayCombined = (arrayShort.concat(arrayLong).sort(function(a,b) {


            return (a.id > b.id) ?  1 : 
                  ((a.id < b.id) ? -1 : 0);

})).sort(function(a,b) {

            return (a.name > b.name) ?  1 : 
                  ((a.name < b.name) ? -1 : 0);

});;

console.log(arrayCombined);

这是输出

[ { id: 'A', name: 'first' },
  { id: 'A', name: 'firstSub1' },
  { id: 'A', name: 'firstSub2' },
  { id: 'A', name: 'firstSub3' },
  { id: 'B', name: 'second' },
  { id: 'B', name: 'secondSub1' },
  { id: 'B', name: 'secondSub2' },
  { id: 'B', name: 'secondSub3' },
  { id: 'C', name: 'third' },
  { id: 'C', name: 'thirdSub1' },
  { id: 'C', name: 'thirdSub2' },
  { id: 'C', name: 'thirdSub3' } ]

Answer 2

使用lodash，您可以执行以下操作：

var arrayShort = [
    { id: 'A', name: 'first' },
    { id: 'B', name: 'second' },
    { id: 'C', name: 'third' }
];

var arrayLong = [
    { id: 'A', name: 'firstSub1' },
    { id: 'A', name: 'firstSub2' },
    { id: 'A', name: 'firstSub3' },
    { id: 'B', name: 'secondSub1' },
    { id: 'B', name: 'secondSub2' },
    { id: 'B', name: 'secondSub3' },
    { id: 'C', name: 'thirdSub1' },
    { id: 'C', name: 'thirdSub2' },
    { id: 'C', name: 'thirdSub3' }
];

_(arrayShort)
    .union(arrayLong)
    .sortByAll('id', 'name')
    .value()
// →
// [
//   { id: 'A', name: 'first' },
//   { id: 'A', name: 'firstSub1' },
//   { id: 'A', name: 'firstSub2' },
//   { id: 'A', name: 'firstSub3' },
//   { id: 'B', name: 'second' },
//   { id: 'B', name: 'secondSub1' },
//   { id: 'B', name: 'secondSub2' },
//   { id: 'B', name: 'secondSub3' },
//   { id: 'C', name: 'third' },
//   { id: 'C', name: 'thirdSub1' },
//   { id: 'C', name: 'thirdSub2' },
//   { id: 'C', name: 'thirdSub3' }
// ]

其中union()是一种连接两个数组而不会产生副作用的便宜方法，sortByAll()允许您按多个属性名称进行排序。

在值上合并两个不同长度的数组对象

重要

我尝试了什么

2 个答案: