Is there a way to combine properties from two different objects?

Question

Is there a way to combine properties from two different objects?

I am working with several JavaScript objects:

{
  x: 5,
  y: 10,
  z: 3
}

and

{
  x: 7,
  y: 2,
  z: 9
}

My task is to add these two objects together based on their keys.

The resulting object should look like this:

{
  x: 12,
  y: 12,
  z: 12
}

Do you have any suggestions or solutions in JavaScript? I have tried using Object.keys.map but it becomes unwieldy when dealing with a large number of elements in my object (around 100).

javascript sum

Answer 1

Answer №1

If you're looking to combine multiple objects using JavaScript, the function below will help you achieve that effortlessly:

var object1 = {
  x: 10,
  y: 20,
  z: 30
};

var object2 = {
  x: 5,
  y: 15,
  z: 25
};

var object3 = {
  x: 8,
  y: 12,
  z: 18
};


function combineObjects(...objects) {
  return objects.reduce((acc, curr) => {
    for (let key in curr) {
      if (curr.hasOwnProperty(key))
        acc[key] = (acc[key] || 0) + curr[key];
    }
    return acc;
  }, {});
}

console.log(combineObjects(object1, object2, object3));

Answer 2

If you're looking to combine multiple objects using JavaScript, the function below will help you achieve that effortlessly:

var object1 = {
  x: 10,
  y: 20,
  z: 30
};

var object2 = {
  x: 5,
  y: 15,
  z: 25
};

var object3 = {
  x: 8,
  y: 12,
  z: 18
};


function combineObjects(...objects) {
  return objects.reduce((acc, curr) => {
    for (let key in curr) {
      if (curr.hasOwnProperty(key))
        acc[key] = (acc[key] || 0) + curr[key];
    }
    return acc;
  }, {});
}

console.log(combineObjects(object1, object2, object3));

Answer 3

Answer №2

Exploring a bit further, anything goes as long as the items match!

const arr = [{
    a: 12,
    b: { a: 12, c: { a: 12 } },
    c: 17
  },
  {
    a: 12,
    b: { a: 12, c: { a: 12 } },
    c: 17
  },
  {
    a: 12,
    b: { a: 12, c: { a: 12 } },
    c: 17
  }
];

const deepMergeSum = (obj1, obj2) => {
  return Object.keys(obj1).reduce((acc, key) => {
    if (typeof obj2[key] === 'object') {
      acc[key] = deepMergeSum(obj1[key], obj2[key]);
    } else if (obj2.hasOwnProperty(key) && !isNaN(parseFloat(obj2[key]))) {
      acc[key] = obj1[key] + obj2[key]
    }
    return acc;
  }, {});
};

const result = arr.reduce((acc, obj) => acc = deepMergeSum(acc, obj));
console.log('result: ', result);

Answer 4

Exploring a bit further, anything goes as long as the items match!

const arr = [{
    a: 12,
    b: { a: 12, c: { a: 12 } },
    c: 17
  },
  {
    a: 12,
    b: { a: 12, c: { a: 12 } },
    c: 17
  },
  {
    a: 12,
    b: { a: 12, c: { a: 12 } },
    c: 17
  }
];

const deepMergeSum = (obj1, obj2) => {
  return Object.keys(obj1).reduce((acc, key) => {
    if (typeof obj2[key] === 'object') {
      acc[key] = deepMergeSum(obj1[key], obj2[key]);
    } else if (obj2.hasOwnProperty(key) && !isNaN(parseFloat(obj2[key]))) {
      acc[key] = obj1[key] + obj2[key]
    }
    return acc;
  }, {});
};

const result = arr.reduce((acc, obj) => acc = deepMergeSum(acc, obj));
console.log('result: ', result);

Answer 5

Answer №3

Give this a shot.

let object1 = 
{ 
  apples:12,
  bananas:8,
  oranges:17
};

let object2 = 
{ 
  apples:2,
  bananas:4,
  oranges:1
};

function sumObjects(obj1, obj2) {
  let total = {};

  Object.keys(obj1).forEach(key => {
    if (obj2.hasOwnProperty(key)) {
      total[key] = obj1[key] + obj2[key]
    }  
  })
  return total;
}

sumObjects(object1, object2);

https://jsfiddle.net/bcpl7vz0/

Answer 6

Give this a shot.

let object1 = 
{ 
  apples:12,
  bananas:8,
  oranges:17
};

let object2 = 
{ 
  apples:2,
  bananas:4,
  oranges:1
};

function sumObjects(obj1, obj2) {
  let total = {};

  Object.keys(obj1).forEach(key => {
    if (obj2.hasOwnProperty(key)) {
      total[key] = obj1[key] + obj2[key]
    }  
  })
  return total;
}

sumObjects(object1, object2);

https://jsfiddle.net/bcpl7vz0/

Answer 7

Answer №4

If each object shares the same keys, you can preselect the keys from one object and then iterate through to create a new result object by combining values at each key.

var o1 = { a: 12, b: 8, c: 17 },
    o2 = { a: 2, b: 4, c: 1 },
    keys = Object.keys(o1),
    result = [o1, o2].reduce(function (r, o) {
        keys.forEach(function (k) {
            r[k] += o[k];
        });
        return r;
    }, keys.reduce(function (r, k) {
        r[k] = 0;
        return r;
    }, Object.create(null)));
    
console.log(result);

Answer 8

If each object shares the same keys, you can preselect the keys from one object and then iterate through to create a new result object by combining values at each key.

var o1 = { a: 12, b: 8, c: 17 },
    o2 = { a: 2, b: 4, c: 1 },
    keys = Object.keys(o1),
    result = [o1, o2].reduce(function (r, o) {
        keys.forEach(function (k) {
            r[k] += o[k];
        });
        return r;
    }, keys.reduce(function (r, k) {
        r[k] = 0;
        return r;
    }, Object.create(null)));
    
console.log(result);

Answer 9

Answer №5

If you only have a pair of items:

const item1 = { name: "apple", price: 2.50 }
const item2 = { name: "banana", price: 1.00 }

const total = Object.fromEntries(Object.keys(item1).map(key=>[key,item1[key]+item2[key]])) 

console.log(total)

Alternatively, if you possess multiple items:

const itemsArray = [{ name: "orange", quantity: 3 }, { name: "grapes", quantity: 5 }, { name: "kiwi", quantity: 2 }]

const sum = Object.fromEntries(Object.keys(itemsArray[0]).map(k=>[k,itemsArray.reduce((acc,obj)=>acc+obj[k],0)]))

console.log(sum)

Answer 10

If you only have a pair of items:

const item1 = { name: "apple", price: 2.50 }
const item2 = { name: "banana", price: 1.00 }

const total = Object.fromEntries(Object.keys(item1).map(key=>[key,item1[key]+item2[key]])) 

console.log(total)

Alternatively, if you possess multiple items:

const itemsArray = [{ name: "orange", quantity: 3 }, { name: "grapes", quantity: 5 }, { name: "kiwi", quantity: 2 }]

const sum = Object.fromEntries(Object.keys(itemsArray[0]).map(k=>[k,itemsArray.reduce((acc,obj)=>acc+obj[k],0)]))

console.log(sum)

Is there a way to combine properties from two different objects?

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

Having trouble connecting with Node.js and Express; encountering ERR_CONNECTION_REFUSED

The reactivity of Vuex and Vue does not work as expected when a dictionary is used as a

What is the method for including a placeholder with sequential numbering?

Updating variable value in a Javascript function

Exposing external variables within the setInterval function

Manipulate properties of objects with React by assigning values from an array

Unveiling the Magic: Transforming Objects into HTML Attributes using AngularJS

Vue not triggering computed property sets

When attempting to use JQuery autocomplete, the loading process continues indefinitely without successfully triggering the intended function

Challenges encountered when attempting to send an array in res.json with the MERN stack

Can a form be submitted using an Ajax request triggered by a div element instead of an input type submit?

Implementing a file download feature in Python when clicking on a hyperlink

I am interested in displaying the PDF ajax response within a unique modal window

What is the best way to keep a button visible at all times and active without needing to be clicked?

Fancybox's Exciting Tandem Events

Tips for efficiently importing a file or folder that is valuable but not currently in use

Iterate through each entry in the database and identify and fix any duplicate records

You can update a JavaScript string by adding values using the '+=' operator

Using jQuery to manipulate the image within a specific div element

Is the exchange between Ajax/jQuery and PHP a two-way street?