Pushing to an array inside an object

Question

I just recently picked up JS and have been working on an exercise to sort people from an array of records, ancestry, into the centuries they lived in and their ages. Here's a sample element from ancestry:

{
name:   "Carolus Haverbeke"
sex:    "m"
born:   1832
died:   1905
father: "Carel Haverbeke"
mother: "Maria van Brussel"
}

Here's my attempt:

ancestry.forEach(function(person) {
  var ages = {};
  var century = Math.ceil(person.died / 100);

  if (century in ages) 
    ages[century].push(person.died - person.born);
  else
    ages[century] = person.died - person.born;
});

This is the general format I'm trying to store in ages, which maps each century to an array of the people's ages:

{
16: [24, 51, 16]
17: [73, 22]
18: [54, 65, 28]
}

I'm really confused as this code only saves the first person in ancestry into ages. I thought it might be because I defined ages inside the forEach, but when I move var ages = {} outside I get this:

TypeError: ages[century].push is not a function (line 18)

Could someone please help explain what's going on and the code should be fixed?

Answer 1

tl;dr

var ancestry = [{ ... }, { ... }, ...],
    ages = {};

ancestry.forEach(function (person) {
    var century = Math.ceil(person.died / 100),
        age = person.died - person.born;

    !ages[century] && (ages[century] = []);

    ages[century].push(age);
});

console.log(ages);

---

We will discribe your code to understand problems:

Assume we have an ancestry Array (that means var ancestry = [{...}, {...}, ...] is in this form and each item look like this:

var ancestry = [{
    name: "Carolus Haverbeke",
    sex:  "m",
    born: 1832,
    died: 1905,
    father: "Carel Haverbeke",
    mother: "Maria van Brussel"
}, {
    name: "Carolus Haverbeke",
    sex:  "m",
    born: 1722,
    died: 1805,
    father: "Carel Haverbeke",
    mother: "Maria van Brussel"
}, {
    name: "Carolus Haverbeke",
    sex:  "m",
    born: 1666,
    died: 1705,
    father: "Carel Haverbeke",
    mother: "Maria van Brussel"
}, {
    name: "Carolus Haverbeke",
    sex:  "m",
    born: 1622,
    died: 1715,
    father: "Carel Haverbeke",
    mother: "Maria van Brussel"
}];

with different data.

To achieve what you want, follow this steps:

// Create your variable in the parent scope to allow variables to exist after the end of `forEach` method.
var ages = {};

// In the ancestry Array, we will loop on all items like `{ ... }`.
ancestry.forEach(function (person) {
  // For each loop `person` will contain the current `{ ... }` item.

  // Because we want add this property to the existant object, we don't need a new object. And as you said,
  // 1. `ages` will be deleted in each loop because is defined into `forEach`
  // var ages = {};

      // We get the century of die.
  var century = Math.ceil(person.died / 100),
      // and age of die
      age = person.died - person.born;

  // now if the century property not exist, create a new array into to accept all centuries after.
  if (!ages[century]) {
      ages[century] = [];
  }
  // equivalent to `!ages[century] && (ages[century] = []);`

    // in all cases, just push the value to the end.
    ages[century].push(age);
});

// Still exist !
console.log(ages); // Object {18: Array(2), 19: Array(1), 20: Array(1)}

your final format is what you want:

{
    18: [39, 93],
    19: [83],
    20: [73]
}

Answer 2

you need to create array in else statement like this ages[century] = [person.died - person.born];

    ancestry.forEach(function(person) {
      var ages = {};
      var century = Math.ceil(person.died / 100);

      if (century in ages) 
        {
        ages[century].push(person.died - person.born);
            }
      else
           {       
        ages[century] = [person.died - person.born];
           }
    });

Answer 3

You need to define ages array outside.

The error you are getting because you have not initialised your ages[century] as an array. Hence it will just store one value.

add this line

ages[century] = []

ages[century].push() will work fine then

Here is the change you need to do in your if-else

if (ages[century]){
   ages[century].push(person.died - person.born);
}
else{
   ages[century] = []
   ages[century].push(person.died - person.born);
}

Answer 4

You need to instantiate the century variables as keys in a key-value pair (a type of array called an "associative array") and then store ages into another array within that array (remember century is your key and the value is an array).

Basically, it's a 2-dimensional associative array so you might as well just use an object.

So it needs to look like var ages = {16: {24, 51, 16}, 17: {73, 22}, 18: {54, 65, 28}};

or

var ages = {16: {}, 17: {}, 18: {}}; and then you can recursively push those values onto the appropriate key's array.

Key-Value Pairs: Best way to store a key=>value array in JavaScript?

Multidimensional Associative Arrays (objects): Multi-dimensional associative arrays in javascript

W3School (JavaScript Objects): https://www.w3schools.com/js/js_objects.asp

You could just store the array of ages in an object and access that array by the key (which in your case you have declared to be century).

If it were me, I would make person an object and then store each person's birthday, date-of-death, and age-at-death as an attribute in a database.

Out of curiosity, what do you do when someone lives in two different centuries? I was born in 1987 and it's 2017 so did I live in the 20th or the 21st century?