JavaScript Garbage collection

A garbage collector monitors all objects and removes those that have become unreachable.

Memory management is crucial in programming that is why the JavaScript engine removes or cleans up all objects that aren't reachable.

We've learned about garbage collection in the previous articles but let's go a little further below:

Reachability

Programs ran on the script are stored in memory for accessibility or reachability.

Let's see a couple of examples below:

const person = {
  name: 'Bello'
};

In the example above person references the object { name: 'Bello' } but what if it is changed or overwritten.

See the example below:

let person = {
  name: 'Bello'
};

person = null;

In the example above, Bello is now unreachable because there are no references to it. This is where the Garbage collector discards the data to free the memory.

Two references

It is possible to set an object to null and still reference it provided it is already copied to another variable.

See the example below:

const person = {
  name: 'Bello'
};

let user = person;
user = null;

console.log(person.name); // Bello

In the example above, the object person is still reachable but through the copied object, user.

Interlinked Objects

See the example below:

const marry = (man, woman) => {
  woman.husband = man;
  man.wife = woman;

  return {
    father: man,
    mother: woman
  }
}

const family = marry(
  { name: "Bello" },
  { name: "Monica" }
);

console.log(family);

/*
{
  father: { name: 'Bello', wife: { name: 'Monica', husband: [Circular] } },
  mother: { name: 'Monica', husband: { name: 'Bello', wife: [Circular] } }
}
*/

delete family.father; // true
delete family.mother.husband; // true

console.log(family) // { mother: { name: 'Monica' } }

The [Circular] means there's an interlinked (closed-loop) relationship between objects.

Circular reference is a series of references where an object references itself directly or indirectly through a series of objects, resulting in a closed-loop, appearing in most computer programming including JavaScript - Akinjide Bankole

All objects above are reachable even after the following code occurred

delete family.father;
delete family.mother.husband;

But if we delete the father object from the family object then Bello has no incoming reference anymore.

delete family.father;

console.log(family)

/*
{
  mother: { name: 'Monica', husband: { name: 'Bello', wife: [Circular] } }
}
*/

console.log(family.father) // undefined

Since Bello is unreachable it gets removed from memory by the garbage collector. Its data also became inaccessible.

Unreachable island

The interlinked objects become unreachable if the global object (family) is initialized to null

See the example below:

const marry = (man, woman) => {
  woman.husband = man;
  man.wife = woman;

  return {
    father: man,
    mother: woman
  }
}

let family = marry({
  name: "Bello"
}, {
  name: "Monica" 
});

family = null;

console.log(family) // null

Setting the global object, familly to null makes the whole island of interlinked objects above removed from memory.