Deduplicate items in object - lost data

Question

I have this as an object (indiErr):

[
  { errorType: 'color-contrast', errorImpact: 'serious', errorCount: 8 },
  { errorType: 'heading-order', errorImpact: 'moderate',  errorCount: 1 },
  { errorType: 'image-alt', errorImpact: 'critical', errorCount: 1 },
  { errorType: 'image-redundant-alt', errorImpact: 'minor', errorCount: 1},
  { errorType: 'landmark-no-duplicate-contentinfo', errorImpact: 'moderate', errorCount: 1},
  { errorType: 'landmark-unique', errorImpact: 'moderate', errorCount: 1 },
  { errorType: 'link-name', errorImpact: 'serious', errorCount: 7 },
  { errorType: 'meta-viewport', errorImpact: 'critical', errorCount: 1 },
  { errorType: 'region', errorImpact: 'moderate', errorCount: 30 },
  { errorType: 'tabindex', errorImpact: 'serious', errorCount: 18 },
  { errorType: 'color-contrast', errorImpact: 'serious', errorCount: 28 },
  { errorType: 'landmark-one-main', errorImpact: 'moderate', errorCount: 1 },
  { errorType: 'page-has-heading-one', errorImpact: 'moderate', errorCount: 1
  }
]

With the following code I deduplicate items and sum the errorCount:

 const holder = {};

 indiErr.forEach(function(d) {
     if (holder.hasOwnProperty(d.errorType)) {
         holder[d.errorType] = holder[d.errorType] + d.errorCount;
         // d.errorImpact= d.errorImpact
         // holder[d.errorImpact] = d.errorImpact
 } else {
     holder[d.errorType] = d.errorCount;
     // d.errorImpact= d.errorImpact
     // holder[d.errorImpact] = d.errorImpact
   }
 });

console.log('holder:', holder)
const obj2 = [];

for (const prop in holder) {
  obj2.push({ errorType: prop, errorCount: holder[prop] });
 }

console.log('Error Object:', obj2);

In the deduplication the values for 'errorImpact' get lost. This is the result:

Error Object: [
  { errorType: 'color-contrast', errorCount: 36 },
  { errorType: 'heading-order', errorCount: 1 },
  { errorType: 'image-alt', errorCount: 1 },
  { errorType: 'image-redundant-alt', errorCount: 1 },
  { errorType: 'landmark-no-duplicate-contentinfo', errorCount: 1 },
  { errorType: 'landmark-unique', errorCount: 1 },
  { errorType: 'link-name', errorCount: 7 },
  { errorType: 'meta-viewport', errorCount: 1 },
  { errorType: 'region', errorCount: 30 },
  { errorType: 'tabindex', errorCount: 18 },
  { errorType: 'landmark-one-main', errorCount: 1 },
  { errorType: 'page-has-heading-one', errorCount: 1 }
]

(color-contrast is deduplicated, and errorCount is summed to: 36)

Is there any way to change the forEach function to also push 'errorImpact' value to 'obj2'? Have tried several things, but am stuck. Also don't know where to search for to solve this. Hope you have some pointers. Tnx!

I would like to have this as result:

[
  { errorType: 'color-contrast', errorImpact: 'serious', errorCount: 36 },
  { errorType: 'heading-order', errorImpact: 'moderate',  errorCount: 1 },
  { errorType: 'image-alt', errorImpact: 'critical', errorCount: 1 },
  { errorType: 'image-redundant-alt', errorImpact: 'minor', errorCount: 1},
  { errorType: 'landmark-no-duplicate-contentinfo', errorImpact: 'moderate', errorCount: 1},
  { errorType: 'landmark-unique', errorImpact: 'moderate', errorCount: 1 },
  { errorType: 'link-name', errorImpact: 'serious', errorCount: 7 },
  { errorType: 'meta-viewport', errorImpact: 'critical', errorCount: 1 },
  { errorType: 'region', errorImpact: 'moderate', errorCount: 30 },
  { errorType: 'tabindex', errorImpact: 'serious', errorCount: 18 },
 
  { errorType: 'landmark-one-main', errorImpact: 'moderate', errorCount: 1 },
  { errorType: 'page-has-heading-one', errorImpact: 'moderate', errorCount: 1
  }
]

what do you mean by push errorImpact. do you want to count based on both errorImpact and errorType — cmgchess, Nov 05 '22 at 14:47
holder should be an object literal instead of a dictionary so that you can assign the errorImpact value — nicolascolman, Nov 05 '22 at 14:47
@cmgchess : added the desired result. Only count 'errorCount'. — Jan Willem, Nov 05 '22 at 15:11
@JanWillem Actually, it's an array const holder = []; Then you have to add as many objects as you need with the format { errorType: '...', errorImpact: '...', errorCount: ... } — nicolascolman, Nov 05 '22 at 15:20
@JanWillem https://codeshare.io/pqVANX this is something like what nicolascolman was refering to. there are also shorter ways of doing this — cmgchess, Nov 05 '22 at 15:21
@cmgchess and nicolascolman : thanks both. The codeshare code works. — Jan Willem, Nov 05 '22 at 16:22
Does this answer your question? [Group objects by multiple properties in array then sum up their values](https://stackoverflow.com/questions/46794232/group-objects-by-multiple-properties-in-array-then-sum-up-their-values) — pilchard, Nov 05 '22 at 22:29

score 2 · Answer 1 · answered Nov 05 '22 at 16:24

2

this did the trick:

const holder = {};

 indiErr.forEach(function(d) {
     if (!holder.hasOwnProperty(d.errorType)) {
         holder[d.errorType] = {errorImpact: d.errorImpact, errorCount: 0};
        }
    holder[d.errorType].errorCount+=d.errorCount
 });

console.log('holder:', holder)
const obj2 = [];

for (const prop in holder) {
  obj2.push({ errorType: prop, ...holder[prop] });
 }

console.log('Error Object:', obj2);

answered Nov 05 '22 at 16:24

Jan Willem

55
2
8

That's a good use of spread operator. Congrats – nicolascolman Nov 05 '22 at 20:47

Andrew Parks · Answer 2 · 2022-11-05T16:00:43.473

0

const errors = [
  { errorType: 'color-contrast', errorImpact: 'serious', errorCount: 8 },
  { errorType: 'heading-order', errorImpact: 'moderate',  errorCount: 1 },
  { errorType: 'image-alt', errorImpact: 'critical', errorCount: 1 },
  { errorType: 'image-redundant-alt', errorImpact: 'minor', errorCount: 1},
  { errorType: 'landmark-no-duplicate-contentinfo', errorImpact: 'moderate', errorCount: 1},
  { errorType: 'landmark-unique', errorImpact: 'moderate', errorCount: 1 },
  { errorType: 'link-name', errorImpact: 'serious', errorCount: 7 },
  { errorType: 'meta-viewport', errorImpact: 'critical', errorCount: 1 },
  { errorType: 'region', errorImpact: 'moderate', errorCount: 30 },
  { errorType: 'tabindex', errorImpact: 'serious', errorCount: 18 },
  { errorType: 'color-contrast', errorImpact: 'serious', errorCount: 28 },
  { errorType: 'landmark-one-main', errorImpact: 'moderate', errorCount: 1 },
  { errorType: 'page-has-heading-one', errorImpact: 'moderate', errorCount: 1
  }
];

let r = {};
errors.forEach(({errorType,errorImpact,errorCount})=>
  (r[errorType]??= {errorType, errorImpact, errorCount:0}).errorCount += errorCount);
console.log(Object.values(r));

edited Nov 05 '22 at 16:00

answered Nov 05 '22 at 15:28

Andrew Parks

6,358
2
12
27

Tnx Andrew, the duplication breaks when I use this. (Had to remove the '??' because got this error : SyntaxError: Unexpected token '?'). – Jan Willem Nov 05 '22 at 16:00
@JanWillem does it not work when you click "Run code snippet"? You just have an older dev environment without new javascript features. Does it work if you replace `??=` with `||=`? – Andrew Parks Nov 05 '22 at 16:02
tnx, I see that 'Snippet' works which is great. I am on Node14. Turned types off, just want javascript. When I use: ' || = ' I get error in Vscode Expression expected. If you have another suggestion, very interested! – Jan Willem Nov 05 '22 at 16:14
@JanWillem see https://stackoverflow.com/questions/29953293/is-there-a-way-to-turn-on-es6-es7-syntax-support-in-vscode for turning on ES7 language features. I'm not familiar with vscode so I can't guide you specifically. – Andrew Parks Nov 05 '22 at 16:32

Deduplicate items in object - lost data

2 Answers2