CODEWITHSUNDEEP
javascript
priyanka.sarkar
priyanka.sarkar

Reputation: 26538

How to merge objects using JavaScript?

I have the below

$scope.Marketing = [{
    'ProductId':1,
    'ProductName':'Product 1',
    'ProductDescription':'Product Description 1'
  },
  {
    'ProductId':2,
    'ProductName':'Product 2',
    'ProductDescription':'Product Description 2'
  }];

  $scope.Finance=[{
    'ProductId':1,
    'Price':'$200.00'
  },
  {
    'ProductId':2,
    'Price':'$100.00'
  }];

  $scope.Inventory=[{
    'ProductId':1,
    'StockinHand:':26
  },
  {
    'ProductId':2,
    'StockinHand':40
  }];

I want the output to be

enter image description here

My Merge function is here

$scope.tempresult=merge($scope.Marketing,$scope.Finance);  
 $scope.result=merge($scope.tempresult,$scope.Inventory);

function merge(obj1,obj2){ // Our merge function
var result = {}; // return result
for(var i in obj1){      // for every property in obj1 
    if((i in obj2) && (typeof obj1[i] === "object") && (i !== null)){
        result[i] = merge(obj1[i],obj2[i]); // if it's an object, merge   
    }else{
       result[i] = obj1[i]; // add it to result
    }
}
for(i in obj2){ // add the remaining properties from object 2
    if(i in result){ //conflict
        continue;
    }
    result[i] = obj2[i];
}

return result;

}

But the output is

enter image description here

The value for first Stock In Hand is missing.

What is the mistake I am making?

Edit

enter image description here

enter image description here

Upvotes: 1

Views: 105

Answers (2)

Arief Shah
Arief Shah

Reputation: 161

you could use Jquery.extend property, have a look at the plnkr code 

$scope.result=merge($scope.Marketing, $scope.Finance,$scope.Inventory);

function merge(obj1,obj2, obj3){
    return $.extend(true, obj1,obj2,obj3)
}
};

http://plnkr.co/edit/gKQ9bc?p=preview

Upvotes: 1

techfoobar
techfoobar

Reputation: 66693

One approach is populating the one array of products with missing properties from the other two (after matching with product id).

See: http://jsfiddle.net/zekbxh90/1/ - and check the console output

Code:

var a = [{
    'ProductId': 1,
        'ProductName': 'Product 1',
        'ProductDescription': 'Product Description 1'
}, {
    'ProductId': 2,
        'ProductName': 'Product 2',
        'ProductDescription': 'Product Description 2'
}];

var b = [{
    'ProductId': 1,
        'Price': '$200.00'
}, {
    'ProductId': 2,
        'Price': '$100.00'
}];

var c = [{
    'ProductId': 1,
        'StockinHand:': 26
}, {
    'ProductId': 2,
        'StockinHand': 40
}];

// lets add the props from b abd c into a to get the desired result
a.forEach(function (_itemA) {

    // get product id in a
    var productId = _itemA.ProductId,
        matching = false,
        prop = false;

    // get the matching item in b and add new props to a
    b.forEach(function (_itemB) {
        if (_itemB.ProductId === productId) merge(_itemA, _itemB);
    });

    // get the matching item in c and add new props to a
    c.forEach(function (_itemC) {
        if (_itemC.ProductId === productId) merge(_itemA, _itemC);
    });

});

console.log(a);

function merge(_to, _from) {
    for (var prop in _from) {
        if (!_to.hasOwnProperty(prop) && _from.hasOwnProperty(prop)) _to[prop] = _from[prop];
    }
}

Upvotes: 1

Related Questions