Combining the data of an object with an array of objects while ensuring that existing key values are not replaced

Question

Combining the data of an object with an array of objects while ensuring that existing key values are not replaced

How can you transform the following array and object:

var array = [{key: [3]}, {key1: [3]}, {key1: [3]}]
var object = {key1: [3], key2: [3]};

into this output:

{key: [3], key1: [9], key2: [3]}

All "key" values represent userIds like "LQVjUacPgK" as shown in the example object below.

[N] = an array of N objects each containing around 10 key-value pairs.

N = {obj, obj, obj};

obj = {_account: "JDQEPxoy3ktZRP9VEzAMtXLa7rXXedhQ4bARq"
_id: "oQER3vznDwikxm1wdLzJFdVjKL6XomcORMxDL"
amount: 170
category: Array[2]
category_id: "21003000"
date: "2015-06-09"Object
type: Object
userId: "LQVjUacPgK"}

Currently, the process being used is:

var test = _.reduce(_.flatten(array.concat([object])),function(a,b){
     return _.extend(a, b);
       });
    }
};

However, the current result is different than desired:

console.log(test)//{key: [3], key1: [3], key2: [3]}

The main issue lies with the fact that key1 has varying values across the objects. The goal is to merge these values accordingly so that key1: [9].

javascript arrays object underscore.js

Answer 1

Answer №1

This answer takes a different approach, avoiding the use of a reduce operation and opting for a simple for-each loop:

const data = [{id: [3]}, {id1: [3]}, {id1: [3]}]
const newData = {id1: [3], id2: [3]};

data.forEach((item) => {
  Object.keys(item).forEach((key) => {
//        newData[key] = [(newData[key] || [])[0] || 0 + item[key][0]];
      newData[key] = (newData[key] || []).concat(item[key]);
  });
});

console.log(JSON.stringify(newData)); // {"id1":[3,3,3],"id2":[3],"id":[3]}

Answer 2

This answer takes a different approach, avoiding the use of a reduce operation and opting for a simple for-each loop:

const data = [{id: [3]}, {id1: [3]}, {id1: [3]}]
const newData = {id1: [3], id2: [3]};

data.forEach((item) => {
  Object.keys(item).forEach((key) => {
//        newData[key] = [(newData[key] || [])[0] || 0 + item[key][0]];
      newData[key] = (newData[key] || []).concat(item[key]);
  });
});

console.log(JSON.stringify(newData)); // {"id1":[3,3,3],"id2":[3],"id":[3]}

Answer 3

Answer №2

Similar to Jane's response (also no underscore), this code snippet generates a new object instead of altering the existing object Object:

let arr = [{name: [3]}, {name1: [3]}, {name1: [3]}]
let obj = {name1: [3], name2: [3]};

let result = arr.concat([obj]).reduce(function(previous, current) {
  Object.keys(current).forEach(function(key){
    if (previous.hasOwnProperty(key)) {
      previous[key][0] += current[key][0];
    } else {
      previous[key] = current[key];
    }
  });
  return previous;
},{});

console.log(JSON.stringify(result));  // {"name":[3],"name1":[9],"name2":[3]}

Answer 4

Similar to Jane's response (also no underscore), this code snippet generates a new object instead of altering the existing object Object:

let arr = [{name: [3]}, {name1: [3]}, {name1: [3]}]
let obj = {name1: [3], name2: [3]};

let result = arr.concat([obj]).reduce(function(previous, current) {
  Object.keys(current).forEach(function(key){
    if (previous.hasOwnProperty(key)) {
      previous[key][0] += current[key][0];
    } else {
      previous[key] = current[key];
    }
  });
  return previous;
},{});

console.log(JSON.stringify(result));  // {"name":[3],"name1":[9],"name2":[3]}

Combining the data of an object with an array of objects while ensuring that existing key values are not replaced

Answer №1

Answer №2

Similar questions

learn how to implement local storage for a to-do list application using JavaScript

What could be causing my jQuery click event to behave as if I triggered a click on the parent element?

Adjusting the properties of an element with Javascript

Leverage Async/Await in React.js with the Axios Library

How can I design a form that resembles the sign-in form used by Google?

The Primevue Chart failed to display

Instead of using setTimeout in useEffect to wait for props, opt for an alternative

JQuery functionality is disrupted by the update panel on the master page

Track the status of an extensive MySQL query using PHP

Incorporating navigation controls into a modal window

To extract three records from storage and store them in the dbResult using a promise join technique

Guide to setting a callback function on a submission button in bootstrap

React dynamic dropdown selection based on previous dropdown values

Google Maps API displaying empty spots instead of markers

In PHP, a boolean variable will not display on the webpage when echoed

The improper utilization or replacement of Jest mock in an Angular standalone component's unit test is causing issues

Utilizing jQuery's extend method for object inheritance in a function

Upon returning, the C string function argument is found to be NULL

Adjustable Footer Size with Minimum Size Constraint

What is the best approach to bring a button into focus after it has been enabled in a React.js application