Filter array of objects by prop value uniqueness

Question

Given this data structure:

const arr = [
  {
    name: "a",
    id: "1",
    vars: [
      { 
        sub_name: "aa", 
        sub_val: 32 
      }, 
      { 
        sub_name: "aa", 
        sub_val: 343 
      }
    ]
  },
  {
    name: "b",
    id: "2",
    vars: [
      { 
        sub_name: "bb", 
        sub_val: 32333
      }, 
      { 
        sub_name: "bc", 
        sub_val: 34312
      }
  }
]

I'm trying to filter each vars property by the uniqueness of the sub_name to return this data structure:

const arr = [
  {
    name: "a",
    id: "1",
    vars: [
      { 
        sub_name: "aa", 
        sub_val: 32 
      }
    ]
  },
  {
    name: "b",
    id: "2",
    vars: [
      { 
        sub_name: "bb", 
        sub_val: 32333
      }, 
      { 
        sub_name: "bc", 
        sub_val: 34312
      }
  }
]

My attempt here:

removeDuplicates (arr, prop) {
  return arr.filter((obj, i, a) => {
    return a.map(o => o[prop]).indexOf(obj[prop]) === i
  })
}

this.someArrayOfObjects.map(o => this.removeDuplicates(o.vars, "sub_name"))

Returns an array of arrays.

const arr = [
  [{
    name: "a",
    id: "1",
    vars: [
      { 
        sub_name: "aa", 
        sub_val: 32 
      }
    ]
  }],
  [{
    name: "b",
    id: "2",
    vars: [
      { 
        sub_name: "bb", 
        sub_val: 32333
      }, 
      { 
        sub_name: "bc", 
        sub_val: 34312
      }
  }]
]

What am I doing wrong?

ikhvjs · Accepted Answer · 2021-06-25 07:00:06Z

1

You miss to spread the ...o to return the rest of properties of the array.

const arr = [ { name: "a", id: "1", vars: [ { sub_name: "aa", sub_val: 32, }, { sub_name: "aa", sub_val: 343, }, ], }, { name: "b", id: "2", vars: [ { sub_name: "bb", sub_val: 32333, }, { sub_name: "bc", sub_val: 34312, }, ], }, ];

function removeDuplicates(arr, prop) {
  return arr.filter((obj, i, a) => {
    return a.map(o => o[prop]).indexOf(obj[prop]) === i;
  });
}

const result = arr.map(o => ({
  ...o,
  vars: removeDuplicates(o.vars, "sub_name"),
}));

console.log(result);

If you want to do it in one function, you can use the function below.

const arr = [ { name: "a", id: "1", vars: [ { sub_name: "aa", sub_val: 32, }, { sub_name: "aa", sub_val: 343, }, ], }, { name: "b", id: "2", vars: [ { sub_name: "bb", sub_val: 32333, }, { sub_name: "bc", sub_val: 34312, }, ], }, ];


function removeDuplicates2(arr, prop) {
  return arr.map(e => ({
    ...e,
    vars: e.vars.filter(
      (el, i, a) => i === a.findIndex(el2 => el[prop] === el2[prop])
    ),
  }));
}

const output = removeDuplicates2(arr, "sub_name");

console.log(output);

edited Jun 25, 2021 at 7:00

answered Jun 25, 2021 at 6:43

ikhvjs

6,0874 gold badges24 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

t56k Over a year ago

I found this the clearest for my purpose, and it used the ES6 spread operator to boot (since I asked about ES6). Thanks!

Tushar Shahi · Accepted Answer · 2021-06-25 06:45:33Z

1

I ran your code and it does not show the same output. However I made this one change and it works:

If you are modifying one property modify then return the object with the modified property:

console.log(arr.map(o => {  o.vars = removeDuplicates(o.vars, "sub_name");
                         return o;} ));

answered Jun 25, 2021 at 6:45

Tushar Shahi

21.6k2 gold badges25 silver badges48 bronze badges

Comments

Prachi Jain · Accepted Answer · 2021-06-25 06:55:07Z

0

try this when you are calling your removeDuplicates function.

const result = arr.map((a) => {
    a.vars = removeDuplicates(a.vars, 'sub_name')
    return a;
})

answered Jun 25, 2021 at 6:55

Prachi Jain

1

Collectives™ on Stack Overflow

Filter array of objects by prop value uniqueness

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related