Storing a value by reference vs by value in Javascript

In Javascript we assign a variable with the = operator.

And we assign variable either with primitives or non-primitive data type.

What are primitives?

Primitives are undefined, null, boolean, string, and number.

So all of the following are assigning primitive to a variable.

var a = 5;
var b = null;
var c = undefined;
var d = true;
var e = false;
var f = "hello there";
var g = "example12345";
var h = 77777;

Non primitives are objects, array and function.

var a = {"Name" : "David"};
var b = [1,2,3,4,5];
var c = function sum(firstNumber, SecondNumber) 
{ return firstNumber + secondNumber };

The way primitives and non-primitives are being assigned is different.

Primitive values and passed by values, while non-primitive values are passed by reference.

If we pass or reference a primitive value, it gets its own spot in memory every time.

var a = 3;
var b = 5;

Every time we make changes to the assignment, the changes doesn't affect other variables even if we do something like this:

var a = "Sarah";
var b = "Sarah";

a = b;  

b = "James"; // who is a?

a is still Sarah

Non-primitives like objects and functions however are passed by reference.

var person = {
	"name": "Sarah"
}

var a = person;
var b = person;

Meaning there's no new values being created and stored in memory, only new references (pointers) are assigned to the object.

So when the object changes, all references assigned to the object changes as well.

var person {
	"name" : "Sarah"
}

var a = person //a.name == "Sarah"
var b = person //b.name == "Sarah"

a.name = "James"

//what is b.name?

b.name == "James"

A practical example

Consider a function where we're adding the total of 2 numbers.

function total(a,b){
	return a+b;
} 

var SarahAge = 7; 
var James = {"age":10}; 
var Mike = James; 

total (SarahAge, James.age) //return 17

Mike.age = 20; //update Mike's age

total (SarahAge, James.age) //now return 27

Notice how after we've updated Mike's age, James' age changes as well. This is because both James and Mike's age are pointing to the same memory.

So when James age changes, so does Mike's.

This is something to be aware of whenever we're passing objects around in functions variables.