Question

我有两个对象数组如下：

result=         [{id:24, name:"xyz"}, {id:45,name:"tze"}]

moreDetails=    [{id:24, name2:"hyi"}, {id:45, name2:"tikw"}]

我想要像上面这样的合并结果

mergedResult= [{id:24, name:"xyz", name2:"hyi"}, {id:45,name:"tze", name2:"tikw"}]

请注意两个数组都在id上发生合并。

我尝试关注此How to merge these arrays/json objects?和此How can I merge properties of two JavaScript objects dynamically?

但是，我认为我迷路了，我的问题可能需要一个简短而简单的解决方案。

修改

我试图简化我的例子。实际上，上述两个数组只有id的共同点，它们的名称不仅仅是name2。例如，有时result数组将id, name, name2, name3，而moreDetails将有id, name, name4。我想说的是，我并不总是提前知道除了id之外两个数组都会有什么。因此，我不能将字段名称硬编码为一些建议的答案。

Answer 1

您可以使用for循环，在这种情况下，扩展其中一个数组元素比创建另一个数组更好：

for (var i = 0; i < result.length; i++) {
    result[i].name2 = moreDetails[i].name2;
}

http://jsfiddle.net/9uchU/

如果目标元素具有不同的索引：

for (var i = 0; i < result.length; i++) {
    var c = result[i],
        // filtering the second array based on the `id` 
        // of the current element 
        m = moreDetails.filter(function(elem) {
             return elem.id === c.id;
        })[0];
    c.name2 = m ? m.name2 : 'not defined';
}

编辑：根据您上次编辑，如@Blender所述，您还可以使用jQuery $.extend()实用程序功能：

$.extend(result, moreDetails);

Answer 2

<html>
<head><title></title>
<script src="http://code.jquery.com/jquery-1.10.0.min.js" ></script>
</head>
<body>

<script>
    function findElement(arr, propName, propValue) {
      for (var i=0; i < arr.length; i++){
        if (arr[i][propName] == propValue){
          return arr[i];
        }
      }
    }

    var result = [{id:24, name:"xyz"}, {id:45,name:"tze"}];
    var moreDetails= [{id:24, name2:"hyi"}, {id:45, name2:"tikw"}];
    var mergedResult = result;

    for (var i = 0; i<result.length;i++ ) {
      //mergedResult[i].name2 = findElement(moreDetails, "id", result[i].id).name2
    $.extend(mergedResult[i],findElement(moreDetails, "id", result[i].id));
    } 

    mergedResult;
</script>
</body>
</html>

如何合并两个对象数组

2 个答案: