Memory Management in JavaScript
Tags: javascript, webdev, womenintech
Published: 2020-08-24 17:44:04

In programming, memory life cycles are almost always the same regardless of which language you are using. Memory management, however, is different between languages. There are other languages that have manual memory management methods, such as C and C++. In JavaScript though, memory is automatically allocated when data types are created, and disposes of them when they aren't needed or used anymore, hence the term *garbage collector*. There are other languages besides JavaScript that also fall under the garbage collector term like Java, Python and Ruby.

Garbage collecting is a form of automatic memory management which monitors all data types that are created and removes the ones that have become unreachable. Let's look at this snippet as an example.

``` javascript
let edmArr = [];
function addObj() {
   let dubstep = {genre: 'Dubstep'}
   edmArr.push(dubstep)
}
addObj()
console.log(edmArr[0])
```
In this example, an empty array is initialized and a function that simply adds an object to that array. When we `console.log(edmArr[0])` after the function call, the output is `{genre: 'Dubstep'}`. Even though `dubstep` isn't in scope, we are still able to access it through the `edmArr`, which means that it needs to say in memory until the reference isn't there (unreachable) anymore. If we were to remove the object from the array, the value of `dubstep` won't be needed and will be garbage collected.

##How is garbage collection actually "collecting the garbage"?
Garbage collection is mainly based on two algorithms, one called **mark-and-sweep** and another called **reference-counting**. The reference-counting algorithm reduces the problem of seeing whether an object is still needed to determine if an object has any other data types referencing it.

``` javascript
let x = {
  animal: 'cat'
}

let y = x

x = "Hello, World!"

console.log('X:', x, 'Y:', y)

```
If you run this example, you'll see `X: 'Hello, World!' Y: {animal: 'cat'}`. Since the value of `x` is no longer an object, `y` is still a reference to it, so there's no need for garbage collecting. If we were to change the value of `y` though, the object would then be collected because it wouldn't be reachable anymore. The 'garbage' will only be collected if there are **zero** references pointing to it. This collection algorithm isn't preferred in modern browsers today because it has a limitation when it comes to circular referencing. If two objects reference each other, it creates a cycle and the algorithm won't really consider them being unneeded because each object has at least one reference pointing to them. This leads to neither of them being collected as "garbage" and is a common cause to memory leaks.


The mark-and-sweep algorithm reduces the definition of "an object no longer needed" to "an object that is unreachable". This algorithm finds the *root* (global object) and then finds all the references from that root, and then the references of those, etc. It finds all the reachable objects, and collects the ones that are unreachable. This algorithm is used in browsers, other garbage collecting languages today because it handles cycles and cyclic dependencies with improvements that have been made on it over time.

Here are some documentations that go more in depth into memory cycles and management. Happy coding!

[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management#:~:text=Some%20high%2Dlevel%20languages%2C%20such,longer%20needed%20and%20reclaim%20it.)

[JavaScript.info](https://javascript.info/garbage-collection)