In this course, we gotta find out what are Values Types and Reference Types. What’s the difference between them and how can we use them properly.

Compare values type and reference types

Example of Value Types

let x = 'apple'

In the part of the computer’s memory is allocated for x variable. x will be a label for this memory location. We say the memory location is 10, and in that location, we have the string ‘apple’.

Example of Reference Types, why we call it reference type?

let x = { title: 'apple'}

Here we set x as an object instead of a string. An object is a reference type. When we running the code, the same as before a part of the computer’s memory is allocated for the x variable. But the object is not stored in this memory location, it stores somewhere else. We say the memory location is 11. So our x variable in which memory location 10 will hold the address of the target memory location, so x is referencing a different memory location.

Why memory allocation is different between value and reference type?

Stack Memory

We use value types for simple values like numbers, string or boolean, and so on in the stack memory. We don’t need much memory for this kind of value.

Heap Memory

However, we use objects and arrays for storing more memory values (complex) in heap memory.

Facts

Value types are immutable

We can not mutate or change them as a value type.

let x = 'apple'
x.toUpperCase()
// result "APPLE"
x
//result will still be "apple"

Reference types are mutable

However, we can mutate or change them as a reference type.

let y = { fruit: 'apple'}
y.fruit = y.fruit.toUpperCase()
//result will be "APPLE"
y
//result will be {fruit : "APPLE"}, been changed to upperCase

Value types are compared by value

When we compare x and y like this, the result is true, even they are two different parts of the memory, but because of their value types, they are compared by the value they’re holding. Like this:

let x = 'apple';
let y = 'apple';
x == y;
//result return to true

Reference types are compared by reference

However, reference types are compared by their references. That means if two objects have the same properties, it’s gonna return false to us. The reason we can understand as the x is referencing this object at location 20 and y is referencing this object at location 21. Example like this:

let x = { fruit: 'apple'};
let y = { fruit: 'apple'};
x == y;
//result return to false

Value types copying by value

Because x is a value type, it copies x’s value and store in y’s value. So now x and y are two variables in the memory.

let x = "apple";
let y = x
alert(y);
// result will be "apple"

Reference types copying by references

However, if x is an object with property ‘apple’, and y will be another variable we set it to x, now both objects are referencing to the same object in memory, that means if we change x fruit to ‘orange’ and print y, it will have fruit set to orange well. Check out the example below!