Understanding a reduce function with if and bracket notation

Question

Please explain the code and elaborate what is running behind the code.

I'm confused with if part if(! acc[key]). does it mean if key not in acc and set key with value array and jump out of if statement and push the obj in acc key value?

In case if key is in acc skip if statement and use another memory acc[key] and set key which is in acc and set value with obj.

Is my explanation correct?

var people = [{
    name: 'Alice',
    age: 21
  },
  {
    name: 'Max',
    age: 20
  },
  {
    name: 'Jane',
    age: 20
  }
];

function groupBy(objectArray, property) {
  return objectArray.reduce(function(acc, obj) {
    var key = obj[property];
    if (!acc[key]) {
      acc[key] = [];

    }
   acc[key].push(obj)
    return acc;

  }, {});
}
var groupedPeople = groupBy(people, 'age')
console.log(JSON.stringify(groupedPeople))

The code here doesn't quite work; you should push onto the grouped object regardless of whether it's the first member or not (move `acc[key].push(obj)` out of the conditional block). — ggorlen, Mar 21 '19 at 02:54
thanks i copied it from my practice codes so i forgot to change the code. — daneillone, Mar 21 '19 at 13:27

Daniel Beck · Answer 1 · 2019-03-21T03:10:35.093

The if (!acc[key]) {...} is just checking whether you've already captured any data for that key in the accumulator. If there's nothing there yet, you put an empty array there with acc[key] = [];, so you'll be able to push data onto it in the next step.

The bug in your code is that you're also including the push in that if clause; this means you'll only get the first object for each value for the given key. Instead you want all the objects for each value for that key.

Here's a fix, with some comments in the code explaining what it's doing at each step:

var people = [{
    name: 'Alice',
    age: 21
  },
  {
    name: 'Max',
    age: 20
  },
  {
    name: 'Jane',
    age: 20
  }
];

function groupBy(objectArray, property) {
  return objectArray.reduce(function(acc, obj) {
    // stepping through each object in the array:
    var key = obj[property]; // "key" is the value of the given property
                             // for this object
    if (!acc[key]) {         // if the accumulator doesn't already have
                             // data for that key,
      acc[key] = [];         // put an empty array there, so we can add
                             // data to it
    }
    // this next line was moved out of the if clause above it, because
    // you always want it to happen:
    acc[key].push(obj)       // push this object onto the accumulator 
                             // at that key
    return acc;              
  }, {});
}
var groupedPeople = groupBy(people, 'age')
console.log(JSON.stringify(groupedPeople))

Understanding a reduce function with if and bracket notation

1 Answers1