JavaScript: Primitive and Reference values

The primitive values are those which value is stored directly on the variable, which are undefined, null, boolean, number and string. Reference values are those stored in memory and accessed through a pointer, javascript doesn’t allow us to access memory directly but its pointers work the same way as in C. A reference value will be an object and the variable will store the address of memory where that value is stored instead than the value itself.

var a = "StringValue" // variable storing a primitive value
var car = new Object();
car.Color = "blue"; //this string value is instead being stored in an object, variable "car" is not a value type but a reference variable pointing a place in memory.

Dynamic Properties

In javascript, you can add, change or delete properties of a reference value at any time, while primitive values can’t have properties at any time:

var car = new Object();
car.Color = "blue";
console.log(car.Color); //this will print "blue" on the console.

var a = "MyString";
a.Color = "red";
console.log(a.Color); // This will print "undefined"

Note that you can add new properties to your objects at any time, not needing to declare them previously or define them at all (be warn! just because you can doesn’t mean you should!!)

Copying values

When copying primitive values you create a complete new variable (space in memory) with the same value, instead, when copying a reference value you are just copying the address to memory of the value, not the full object:

var a = 5;
var b = a;
console.log(b); // prints: 5
b = 6;
console.log(a); // prints 5
console.log(a); // prints 6

// Example 2:
var obj1 = new Object();
obj1.Color = red";
var obj2 = obj1;
console.log(obj2.Color); // prints red
obj2.Color = "yellow";
console.log(obj1.Color); // prints yellow
console.log(obj2.Color); // prints yellow

Argument passing

All function arguments in ECMAScript are passed by value. This means that the value of the variable is copied to another variable and used as local inside that function. As said before, for primitive values that means we’ll have a total copy of that value, while for reference values we will have a copy of the address in memory, allowing this:

function clean(a){
    a = "";
    return a;
}

var a = "somestring";
a = clean(a);
console.log(a); // prints "" (empty)

// Example 2:
function clean(a){
    a = "anotherString";
    console.log(a); // prints "anotherString"
}

var a = "somestring";
clean(a);
console.log(a); // prints "somestring"

//Example with ref value:
function setColor(obj){
    obj.Color = "blue";
}

var car = new Object();
setColor(car);
console.log(car.Color); //prints "blue" even though that was set inside a function

//Example 2 with ref values:
function setColor(obj){
    obj = new Object(); // on changing the memory address of this var, it's now pointing to a diff place, so it won't change our car's color
    obj.Color = "blue";
}

var car = new Object();
obj.Color = "red";
setColor(car);
console.log(car.Color); //prints "red" as what was passed to the function is a copy of the address, if we change the pointer then it points to another object.

Note that what you are sending to the function when you send a ref value is a copy of the pointer but still a pointer, if you change the value of the object, both pointers are pointing to the same object so you will be changing that object’s value. But if you change the value of the pointer memory address, the pointer does not point to the same object anymore and changes on this object won’t affect the one you sent on the parameter.

Determining type

You can use typeof to check the type of an object, this is best way to determine the type of a primitive object but not as good for reference ones as it will return the primitive type or “object”:

var s = "string";
var b = true;
var i = 5;
var u;
var n = null;
var obj = new Object();

console.log(s); // prints string
console.log(i); // prints number
console.log(b); // prints boolean
console.log(u); // prints undefined
console.log(n); // prints object
console.log(o); // prints object

Note that both null and object return object. As that’s not that useful when working with objects, we can use instanceof to check the type of the object, instanceof will return true if the type is correct:

var car = new Object();
console.log(car instanceof Object);
console.log(b instanceof Array);
console.log(c instanceof RegExp);

you can learn much more about Javascript on the book “Professional JavaScript for Web Developers” sold on amazon.