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.
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);