Create an array from another array's object values that are matching

Question

I'm trying to wrap my head around some more advanced uses of .reduce(), but still have a long way to go. The current issue has left me kind of clueless.

Let's say I have a an array of objects that looks like this:

const people = [
    {
        name: "Henry",
        id: "1934",
        wormsEaten: 4
    },
    {
        name: "Melinda",
        id: "9283",
        wormsEaten: 0
    },
    {
        name: "James",
        id: "1029",
        wormsEaten: 4
    },
    {
        name: "Charles",
        id: "7210",
        wormsEaten: 3
    },
    {
        name: "Sasha",
        id: "4431",
        wormsEaten: 3
    },
]

I now want to create a new array of arrays for each matching wormsEaten value, i.e. an array that looks like this:

[
    [
        {
            name: "Henry",
            id: "1934",
            wormsEaten: 4
        },
        {
            name: "James",
            id: "1029",
            wormsEaten: 4
        }
    ],
    [
        {
            name: "Melinda",
            id: "9283",
            wormsEaten: 0
        }
    ],
    [
        {
            name: "Charles",
            id: "7210",
            wormsEaten: 3
        },
        {
            name: "Sasha",
            id: "4431",
            wormsEaten: 3
        }
    ]
]

My pseudocode-thinking brain says something along the lines of:

people.reduce((accumulator, currentPerson) => {
    if(accumulator.wormsEaten === currentPerson.wormsEaten) {
        return [
          …
        ]
    }
})

But that's roughly how far I get. I feel like I have a long way to go with this type of thinking and would be thankful if someone could help me in the right direction.

User863 · Accepted Answer · 2021-05-20 15:58:21Z

2

By grouping with wormsEaten

const people = [{name:"Henry",id:"1934",wormsEaten:4},{name:"Melinda",id:"9283",wormsEaten:0},{name:"James",id:"1029",wormsEaten:4},{name:"Charles",id:"7210",wormsEaten:3},{name:"Sasha",id:"4431",wormsEaten:3}]

const result = people.reduce((accumulator, currentPerson) => {
    accumulator[currentPerson.wormsEaten] = accumulator[currentPerson.wormsEaten] || []
    accumulator[currentPerson.wormsEaten].push(currentPerson)
    
    return accumulator
}, {})

console.log(Object.values(result))

UPDATE to preserve order

const people = [{name:"Henry",id:"1934",wormsEaten:4},{name:"Melinda",id:"9283",wormsEaten:0},{name:"James",id:"1029",wormsEaten:4},{name:"Charles",id:"7210",wormsEaten:3},{name:"Sasha",id:"4431",wormsEaten:3}]

const result = people.reduce((accumulator, currentPerson) => {
    let key = 'wormsEaten' + currentPerson.wormsEaten // to preserve order
    accumulator[key] = accumulator[key] || []
    accumulator[key].push(currentPerson)
    
    return accumulator
}, {})

console.log(Object.values(result))

edited May 20, 2021 at 15:58

answered May 20, 2021 at 13:36

User863

20.1k3 gold badges20 silver badges45 bronze badges

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

2 Comments

Erik Blomqvist Over a year ago

That's actually really clever! Starting to make sense to me now. I've tried implementing a sort function on this, before the reduce, but since wormsEaten can contain negative numbers, the output becomes (let's say I have the values 4, 0, 3 and -9) 0, 3, 4 and -9. I'm doing this by first having a people.sort((a, b) => a.wormsEaten - b.wormsEaten) (which gives me the correct order). But the reduce seems to change it? Why is that?

pilchard Over a year ago

positive integer object properties are sorted in ascending numeric order, so when grouping using an object the resulting Object.values() follow the ordering of the properties. To avoid changing your sorting you can group into a Map or directly into an array.

pilchard · Accepted Answer · 2021-05-20 16:10:15Z

Sorting will be more efficient after grouping since you will have a shorter array.

const people = [{ name: "Melinda", id: "9283", wormsEaten: 0 }, { name: "James", id: "1029", wormsEaten: 4 }, { name: "Charles", id: "7210", wormsEaten: 3 }, { name: "Sasha", id: "4431", wormsEaten: 3 }, { name: "Henry", id: "1934", wormsEaten: -9 }];

const result = {};
for (const person of people) {
  (result[person.wormsEaten] ??= []).push({ ...person });
}

const sortedResult = Object.values(result).sort(([a], [b]) => a.wormsEaten - b.wormsEaten)

console.log(sortedResult)

.as-console-wrapper { max-height: 100% !important; top: 0; }

If you must sort before grouping you can maintain your sorted array ordering through the reduce by accumulating into a Map, which maintains insertion order; into an Array, which necessarily enforces insertion order; or keep using an object, but force all your properties to be strings.

Map

const
  people = [{ name: "Melinda", id: "9283", wormsEaten: 0 }, { name: "James", id: "1029", wormsEaten: 4 }, { name: "Charles", id: "7210", wormsEaten: 3 }, { name: "Sasha", id: "4431", wormsEaten: 3 }, { name: "Henry", id: "1934", wormsEaten: -9 }],
  sorted = people.sort((a, b) => a.wormsEaten - b.wormsEaten),

  result = sorted.reduce((map, person) => {
    if (!map.has(person.wormsEaten)) {
      map.set(person.wormsEaten, []);
    }
    map.get(person.wormsEaten).push({ ...person });

    return map;
  }, new Map)

console.log([...result.values()])

.as-console-wrapper { max-height: 100% !important; top: 0; }

Array

const
  people = [{ name: "Melinda", id: "9283", wormsEaten: 0 }, { name: "James", id: "1029", wormsEaten: 4 }, { name: "Charles", id: "7210", wormsEaten: 3 }, { name: "Sasha", id: "4431", wormsEaten: 3 }, { name: "Henry", id: "1934", wormsEaten: -9 }],
  sorted = people.sort((a, b) => a.wormsEaten - b.wormsEaten),

  result = sorted.reduce((arr, person) => {
    let groupIndex = arr.findIndex(_arr => _arr[0].wormsEaten === person.wormsEaten);

    if (groupIndex === -1) {
      groupIndex = arr.push([]) - 1;
    }

    arr[groupIndex].push({ ...person });

    return arr;
  }, []);

console.log(result)

.as-console-wrapper { max-height: 100% !important; top: 0; }

Alternative implementation since you have already sorted the array by the property you will be grouping by.

const
  people = [{ name: "Melinda", id: "9283", wormsEaten: 0 }, { name: "James", id: "1029", wormsEaten: 4 }, { name: "Charles", id: "7210", wormsEaten: 3 }, { name: "Sasha", id: "4431", wormsEaten: 3 }, { name: "Henry", id: "1934", wormsEaten: -9 }],
  sorted = people.sort((a, b) => a.wormsEaten - b.wormsEaten),

  result = sorted.reduce((arr, person) => {
    if (person.wormsEaten !== arr[arr.length - 1]?.[0].wormsEaten) {
      arr.push([])
    }

    arr[arr.length - 1].push({ ...person })

    return arr;
  }, []);

console.log(result)

.as-console-wrapper { max-height: 100% !important; top: 0; }

Object with string properties

const
  people = [{ name: "Melinda", id: "9283", wormsEaten: 0 }, { name: "James", id: "1029", wormsEaten: 4 }, { name: "Charles", id: "7210", wormsEaten: 3 }, { name: "Sasha", id: "4431", wormsEaten: 3 }, { name: "Henry", id: "1934", wormsEaten: -9 }],
  sorted = people.sort((a, b) => a.wormsEaten - b.wormsEaten),

  result = sorted.reduce((obj, person) => {
    (obj[`_${person.wormsEaten}`] || (obj[`_${person.wormsEaten}`] = [])).push({ ...person });

    return obj;
  }, {})

console.log(Object.values(result))

.as-console-wrapper { max-height: 100% !important; top: 0; }

A reduce() call like this is equivalent to a standard for loop with an internally passed accumulator. Here illustrated with a for..of loop and using the nullish logical assignment operator (??=).

const
  people = [{ name: "Melinda", id: "9283", wormsEaten: 0 }, { name: "James", id: "1029", wormsEaten: 4 }, { name: "Charles", id: "7210", wormsEaten: 3 }, { name: "Sasha", id: "4431", wormsEaten: 3 }, { name: "Henry", id: "1934", wormsEaten: -9 }],
  sorted = people.sort((a, b) => a.wormsEaten - b.wormsEaten);

const result = {};
for (const person of people) {
  (result[`_${person.wormsEaten}`] ??= []).push({ ...person });
}

console.log(Object.values(result))

.as-console-wrapper { max-height: 100% !important; top: 0; }

Collectives™ on Stack Overflow

Create an array from another array's object values that are matching

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related