Comment fusionner deux ensembles d'objets

J'ai deux types d'objets comme suit:

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

Je veux un résultat fusionné ci-dessus comme celui-ci

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

Notez que la fusion se produit sur l'identifiant, que les deux ensembles ont.

J'ai essayé de suivre celui-ci. Comment fusionner ces objets arrays / json? Et celui-ci Comment fusionner les propriétés de deux objets JavaScript de manière dynamique?

Mais, je pense que je me suis perdu et ma question pourrait nécessiter une solution simple et simple.

MODIFIER

J'ai essayé de simplifier mon exemple. En réalité, les deux tableaux ci-dessus ont juste un id en commun, ils ont plus que le nom, le nom2. Par exemple, le tableau de result aura un id, name, name2, name3 et plus. Les moreDetails auront un id, name, name4 . J'essaie de dire que je ne connais pas toujours à l'avance ce que les deux systèmes auront, sauf id . Donc, je ne peux pas coder les noms de champs comme certaines des réponses suggérées.

Vous pouvez utiliser une boucle for , dans ce cas, étendre l'un des éléments des tableaux est mieux que de créer un autre tableau:

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

http://jsfiddle.net/9uchU/

Dans le cas où les éléments cibles ont des indices différents:

 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'; } 

Modifier: en fonction de votre dernière édition, les mentions @Blender, vous pouvez également utiliser la fonction jQuery $.extend() :

 $.extend(result, moreDetails); 
 <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>