Merging objects in array by matching same key values

Question

Sorry if the json is not perfect, i was trying to type it into the Stackoverflow window... Anyway, you can see from below that I want to take all of the separate objects in the array and merge them into the first array that has the matching url. Once they are merged all of the others need to get removed from the array.

var myArray = [
{ 
 id: '123',
 url: 'http://foo.com/1.jpg',
 size: 7,
 qty: 1
},
{
 id: '345',
 url: 'http://foo.com/5.jpg',
 color: 'blue',
 qty: 5
},
{
 id: '678',
 url: 'http://foo.com/1.jpg',
 size: 8,
 qty: 4
}];

I need to make this array turn into... Below you can see that the objects that had matching url now have been moved into the first matched objects 'variations' key. They no longer appear separate after that. They are essentially all matched together and merged into the same object.

var myArray = [{ 
 id: '123',
 url: 'http://foo.com/1.jpg',
 variations:[
     {
       id : '123'
       size : 7,
       qty: 1
     }, 
     {
       id : '678'
       size : 8,
       qty: 4
     }],
{
 id: '345',
 url: 'http://foo.com/5.jpg',
 color: 'blue',
 qty: 5
}];

So far I have something like this: But this is just work in progress. Having trouble bringing this to the finish line.

myArray.forEach(function(product, index){
  var sizeVariations = [];
  var currentSearch = product.url;
  var filteredArray = processedProducts.filter(function( obj ) {
    return obj.primary_image === currentSearch;
  });

  if(filteredArray){
    filteredArray.forEach(function(data, index){
      sizeVariations.push({
        id : data.id,
        size : data.size,
        quantity : data.qty
      });
    });
  }
});

Answer 1

You can do something similar to this; I am not keeping the id at the top level since it looks like a duplication of data.

var myArray = [
{ 
 id: '123',
 url: 'http://foo.com/1.jpg',
 size: 7,
 qty: 1
},
{
 id: '345',
 url: 'http://foo.com/5.jpg',
 color: 'blue',
 qty: 5
},
{
 id: '678',
 url: 'http://foo.com/1.jpg',
 size: 8,
 qty: 4
}];

function mergeObjects(arr)
{
  var resultArray = [];
  var urls = [];
  for(var item in arr)
  {
    var itemIndex = urls.indexOf(arr[item].url);
    if(itemIndex == -1)
    {
      urls.push(arr[item].url);
      var obj = {};
      obj.url = arr[item].url;
      obj.variations = [];
      var variationData = {};
      variationData.id = arr[item].id;
      if(arr[item].size !== undefined)
      {
        variationData.size = arr[item].size;
      }
      if(arr[item].qty !== undefined)
      {
        variationData.qty = arr[item].qty;
      }
      if(arr[item].color !== undefined)
      {
        variationData.color = arr[item].color;
      }
     
      obj.variations.push(variationData);
      resultArray.push(obj);
    }
    else
    {
      var variationData = {};
      variationData.id = arr[item].id;
      if(arr[item].size !== undefined)
      {
        variationData.size = arr[item].size;
      }
      if(arr[item].qty !== undefined)
      {
        variationData.qty = arr[item].qty;
      }
      if(arr[item].color !== undefined)
      {
        variationData.color = arr[item].color;
      }
      resultArray[itemIndex].variations.push(variationData)
    }
    
  }
  return resultArray;
}

console.log(mergeObjects(myArray));