on second loop arr.reduce accumulator is undefined and raise an error when trying to read something from it

Question

I have an array of Object, I'm trying to reduce it to age group people and how many of them voted. on first loop it works good, on second loop accumulator becomes undefined and therefore I can't put anything in it.

this is my array of Object i'm looping over

var voters = [
  { name: 'Bob', age: 30, voted: true },
  { name: 'Jake', age: 32, voted: true },
  { name: 'Kate', age: 25, voted: false },
  { name: 'Sam', age: 20, voted: false },
  { name: 'Phil', age: 21, voted: true },
  { name: 'Ed', age: 55, voted: true },
  { name: 'Tami', age: 54, voted: true },
  { name: 'Mary', age: 31, voted: false },
  { name: 'Becky', age: 43, voted: false },
  { name: 'Joey', age: 41, voted: true },
  { name: 'Jeff', age: 30, voted: true },
  { name: 'Zack', age: 19, voted: false },
];

and this is my function with the default accumulator object

function voterResults(arr) {
  // your code here
  arr.reduce(
    (acc, person) => {
      const type =
        person.age >= 18 && person.age <= 25
          ? `Young`
          : person.age <= 55
          ? `Mid`
          : `Old`;

      if (person.voted) {
        acc[`num${type}People`]++;
        acc[`num${type}VotesPeople`]++;
      }
    },
    {
      numYoungVotesPeople: 0,
      numYoungPeople: 0,
      numMidVotesPeople: 0,
      numMidPeople: 0,
      numOldVotesPeople: 0,
      numOldPeople: 0,
    }
  );
}

I expect that every loop it will add the person to it's right age group and if he voted then it will add that to the age group voted counter. error is can't read from undefined even tho on first loop it works just fine.

@Andy even tho it's an arrow function? can you explain when I need to use return while using arrow functions? — LightSkyLiam, Jun 21 '23 at 13:16
Also, it seems that a filter first on person.voted would easily speed up the process. — Wimanicesir, Jun 21 '23 at 13:16
@LightSkyLiam, if you use brackets, it will not return automatically. So () => element vs () => { return element } — Wimanicesir, Jun 21 '23 at 13:17
https://stackoverflow.com/questions/35440265/curly-brackets-in-arrow-functions @LightSkyLiam — Andy, Jun 21 '23 at 13:21

score 0 · Answer 1 · answered Jun 21 '23 at 23:26

Problem with your code:

in a .reduce() you need to return the accumulator (that is the reason for the error you reported)
your voterResults function does not return the result
you accumulator counts are off, acc['num${type}People']++ needs to be outside the if statement

Corrected code:

const voters = [
  { name: 'Bob', age: 30, voted: true },
  { name: 'Jake', age: 32, voted: true },
  { name: 'Kate', age: 25, voted: false },
  { name: 'Sam', age: 20, voted: false },
  { name: 'Phil', age: 21, voted: true },
  { name: 'Ed', age: 55, voted: true },
  { name: 'Tami', age: 54, voted: true },
  { name: 'Mary', age: 31, voted: false },
  { name: 'Becky', age: 43, voted: false },
  { name: 'Joey', age: 41, voted: true },
  { name: 'Jeff', age: 30, voted: true },
  { name: 'Zack', age: 19, voted: false },
];

function voterResults(arr) {
  // your code here
  return arr.reduce(
    (acc, person) => {
      const type =
        person.age >= 18 && person.age <= 25
          ? `Young`
          : person.age <= 55
          ? `Mid`
          : `Old`;

      acc[`num${type}People`]++;
      if (person.voted) {
        acc[`num${type}VotesPeople`]++;
      }
      return acc;
    },
    {
      numYoungVotesPeople: 0,
      numYoungPeople: 0,
      numMidVotesPeople: 0,
      numMidPeople: 0,
      numOldVotesPeople: 0,
      numOldPeople: 0,
    }
  );
}

console.log(JSON.stringify(voterResults(voters), null, '  '));

Output:

{
  "numYoungVotesPeople": 1,
  "numYoungPeople": 4,
  "numMidVotesPeople": 6,
  "numMidPeople": 8,
  "numOldVotesPeople": 0,
  "numOldPeople": 0
}

on second loop arr.reduce accumulator is undefined and raise an error when trying to read something from it

1 Answers1