javascript - Using reduce, from an array of objects, create a set of elements inside the objects' array attributes - Sta

admin管理员组

文章数量:1426464

Given the following array:

foos = [
  {
    id: 0,
    bar: ['a','b','c']
  },
  {
    id: 1,
    bar: ['a','b','d']
  },
  {
    id: 2,
    bar: ['a','c']
  },
]

Using reduce, how can I achieve the following?:

bars == ['a','b','c','d']

I've tried:

foo.reduce((bars, foo) => bars.add(foo.bar), new Set())

But it results in a set of objects:

Set { {0: 'a', 1: 'b', 2: 'c'}, {0: 'a', 1: 'b', 2: 'd'}{0: 'a', 1: 'c'}}

And:

foos.reduce((bars, foo) => foo.bar.forEach(bar => bars.add(bar)), new Set())

But the forEach has no access to the bars set.

Given the following array:

foos = [
  {
    id: 0,
    bar: ['a','b','c']
  },
  {
    id: 1,
    bar: ['a','b','d']
  },
  {
    id: 2,
    bar: ['a','c']
  },
]

Using reduce, how can I achieve the following?:

bars == ['a','b','c','d']

I've tried:

foo.reduce((bars, foo) => bars.add(foo.bar), new Set())

But it results in a set of objects:

Set { {0: 'a', 1: 'b', 2: 'c'}, {0: 'a', 1: 'b', 2: 'd'}{0: 'a', 1: 'c'}}

And:

foos.reduce((bars, foo) => foo.bar.forEach(bar => bars.add(bar)), new Set())

But the forEach has no access to the bars set.

• javascript
• set
• reduce

Share Improve this question Follow asked Oct 20, 2021 at 12:02 RnRogerRnRoger 69011 gold badge99 silver badges3535 bronze badges 3

• Use map inside reduce, you are pushing bar array into set, that is pushing whole bar object into set – Awais Commented Oct 20, 2021 at 12:07
• You need to loop through foo.bar and add them individually to bars.add(). And return the bars set from the reduce – adiga Commented Oct 20, 2021 at 12:12
• 1 Or to shorten it: new Set( foos.flatMap(f => f.bar) ) – adiga Commented Oct 20, 2021 at 12:13

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

Instead of creating a Set inside your reduce. You could just reduce all bar arrays into a single one and pass that to your Set constructor.

const foos = [
  {
    id: 0,
    bar: ['a','b','c']
  },
  {
    id: 1,
    bar: ['a','b','d']
  },
  {
    id: 2,
    bar: ['a','c']
  },
];

const bars = new Set(foos.reduce((all, foo) => [...all, ...foo.bar], []));

console.log(...bars);

With flatMap:

const foos = [
  {
    id: 0,
    bar: ['a','b','c']
  },
  {
    id: 1,
    bar: ['a','b','d']
  },
  {
    id: 2,
    bar: ['a','c']
  },
];

const bars = new Set(foos.flatMap(foo => foo.bar));

console.log(...bars);

You can concat the bar property in the accumulator, and use .filter method to make the values unique:

const foos = [{
    id: 0,
    bar: ['a', 'b', 'c']
  },
  {
    id: 1,
    bar: ['a', 'b', 'd']
  },
  {
    id: 2,
    bar: ['a', 'c']
  },
];

const bars = foos
  .reduce((acc, itm) => acc.concat(itm.bar), [])
  .filter((i, x, s) => s.indexOf(i) === x);

console.log(...bars);

本文标签：