Using lodash to combine the values of identical objects

Question

Using lodash to combine the values of identical objects

As a newcomer to development, I am looking to group similar objects within an array of JSON objects. Here is an example of my JSON array:

var data = [
    {
        zone: "Bottom",
        group: "Bottom girders",
        original: 7,
        gauge: 3,
        dPercent: 0,
        permissible: 10,
    },
    ...
];

The desired final output is:

[
      {
        "zone": "Neutral Axis",
        "groups": [...]
      },
      {
        "zone": "Bottom",
        "groups": [...]
      }
    ]

I aim to organize the data by zone, then within each zone by different group, and display the summed up values for original and gauge as shown in the final output.

If you'd like to see the code I have been working on, please visit this link:

Thank you very much in advance!

javascript angular typescript logic lodash

Answer 1

Answer №1

Based on the output example provided, it appears that you are looking to group your entities by their zone property and obtain the result as an array.

Here is the code snippet that accomplishes this:

var data = [/*your data here*/];

var groupedData = _.groupBy(data, 'zone');
var result = _.map(groupedData, (value, key) => {
  return {
    "zone": key,
    "groups": value
  }
});

If you prefer chaining methods, you can achieve the same result like this:

var result = _.chain(data)
  .groupBy('zone')
  .map((value, key) => {
    return {
      "zone": key,
      "groups": value
    }
  }).value();

The _.groupBy function converts your data array into an object structured like this:

{
   "Bottom":[
      /* All entities with zone "Bottom" */
   ],
   "Neutral axis":[
      /* All entities with zone "Neutral axis" */
   ]
}

Subsequently, we convert this object into an array of objects according to your specifications using _.map.

Additional Resources:

https://lodash.com/docs/4.17.15#groupBy

https://lodash.com/docs/4.17.15#map

https://lodash.com/docs/4.17.15#chain

Answer 2

Based on the output example provided, it appears that you are looking to group your entities by their zone property and obtain the result as an array.

Here is the code snippet that accomplishes this:

var data = [/*your data here*/];

var groupedData = _.groupBy(data, 'zone');
var result = _.map(groupedData, (value, key) => {
  return {
    "zone": key,
    "groups": value
  }
});

If you prefer chaining methods, you can achieve the same result like this:

var result = _.chain(data)
  .groupBy('zone')
  .map((value, key) => {
    return {
      "zone": key,
      "groups": value
    }
  }).value();

The _.groupBy function converts your data array into an object structured like this:

{
   "Bottom":[
      /* All entities with zone "Bottom" */
   ],
   "Neutral axis":[
      /* All entities with zone "Neutral axis" */
   ]
}

Subsequently, we convert this object into an array of objects according to your specifications using _.map.

Additional Resources:

https://lodash.com/docs/4.17.15#groupBy

https://lodash.com/docs/4.17.15#map

https://lodash.com/docs/4.17.15#chain

Answer 3

Answer №2

Essentially, what you're looking for is:

Firstly, group by the zone attribute
Then within each group, further group by the group attribute
For each group, have the zone as a key and an array of nested groups under the groups key
Within each nested group, include the zone, group values directly, and sum up the other 4 attributes (referred to as original) for that nested group

Let's achieve this easily with the following code snippet:

const data = [{"zone":"Bottom","group":"Bottom girders","original":7,"gauge":3,"dPercent":0,"permissible":10},{"zone":"Bottom","group":"Bottom girders","original":9,"gauge":7,"dPercent":0,"permissible":10},{"zone":"Bottom","group":"risers","original":7,"gauge":3,"dPercent":0,"permissible":10},{"zone":"Neutral axis","group":"Transverse PSM","original":17,"gauge":28,"dPercent":0,"permissible":15},{"zone":"Neutral axis","group":"Transverse PSM","original":17,"gauge":12,"dPercent":0,"permissible":15}];

var res = _(data)
    .groupBy('zone')
    .map((grp, zone) => ({
        zone,
        groups: _(grp).groupBy('group').map((nestGrp, group) => ({
            zone,
            group,
            original: _.sumBy(nestGrp, 'original'),
            gauge: _.sumBy(nestGrp, 'gauge'),
            dPercent: _.sumBy(nestGrp, 'dPercent'),
            permissible: _.sumBy(nestGrp, 'permissible')
        })).value()
    })).value();
    
 console.log(res);

<script src="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ec8083888d9f84acd8c2dddbc2dedd">[email protected]</a>/lodash.min.js"></script>

Answer 4

Essentially, what you're looking for is:

Firstly, group by the zone attribute
Then within each group, further group by the group attribute
For each group, have the zone as a key and an array of nested groups under the groups key
Within each nested group, include the zone, group values directly, and sum up the other 4 attributes (referred to as original) for that nested group

Let's achieve this easily with the following code snippet:

const data = [{"zone":"Bottom","group":"Bottom girders","original":7,"gauge":3,"dPercent":0,"permissible":10},{"zone":"Bottom","group":"Bottom girders","original":9,"gauge":7,"dPercent":0,"permissible":10},{"zone":"Bottom","group":"risers","original":7,"gauge":3,"dPercent":0,"permissible":10},{"zone":"Neutral axis","group":"Transverse PSM","original":17,"gauge":28,"dPercent":0,"permissible":15},{"zone":"Neutral axis","group":"Transverse PSM","original":17,"gauge":12,"dPercent":0,"permissible":15}];

var res = _(data)
    .groupBy('zone')
    .map((grp, zone) => ({
        zone,
        groups: _(grp).groupBy('group').map((nestGrp, group) => ({
            zone,
            group,
            original: _.sumBy(nestGrp, 'original'),
            gauge: _.sumBy(nestGrp, 'gauge'),
            dPercent: _.sumBy(nestGrp, 'dPercent'),
            permissible: _.sumBy(nestGrp, 'permissible')
        })).value()
    })).value();
    
 console.log(res);

<script src="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ec8083888d9f84acd8c2dddbc2dedd">[email protected]</a>/lodash.min.js"></script>

Using lodash to combine the values of identical objects

Answer №1

Answer №2

Similar questions

What is the method for calling a JavaScript function from one file to another within a Node.js environment?

What is the best way to change a canvas into an image while preserving transparency?

Adorn your restify rendering

What is the best way to arrange a list in Angular2 using AngularFire2's FirebaseListObservable?

"Exploring the world of arrays and looping in

Is it possible to pass props in React-Native without relying on the navigator component

What is the best way to surround the initial x words within an element with a span tag?

SlidingPane header in React disappearing behind Nav bar

Angular Material Progress Spinner is static and not animated

Can a hyperlink exist without a specified href attribute?

Persistent column menu in ag-grid

Error: The array contains an undefined image object

Could someone provide me with a breakdown of this code utilizing the .bind() function?

Delay the execution in selenium webdriver using Java until the login button is clicked manually

Prevent parent element from triggering double click when double clicking on children element with CSS or jQuery

The content located at “http://localhost:3000/public/static/” was restricted because of a mismatch in MIME type (text/html) which triggered the X-Content-Type-Options:nosniff protocol

A guide on fetching the selected date from a datepicker in framework7 with the help of vuejs

Do NodeJS and Express require sanitizing the request body for post requests to prevent cross-site scripting (XSS) attacks?

Tips for retrieving data from a Node.js server with a POST request in a React application

Sending an array containing a mix of data types from PHP to a JavaScript array