Javascript Object Oriented Design - Javascript Reference Types








Reference types represent objects in JavaScript.

Reference values are instances of reference types.

An object in Javascript is an unordered list of properties consisting of a name in string type and a value.

When the value of a property is a function, it is called a method.

Functions themselves are actually reference values in JavaScript.

A property that contains an array is the value we can use to store inner state of an object.

A function property can be executed.

We must create objects before using them.

Creating Objects

We can think of JavaScript objects as hash tables.

We can use the new operator with a constructor to create an object.

A constructor is a function that uses new to create an object.

Any Javascript function can be a constructor for an object. The syntax to create a contructor is the same as the syntax to create a function.

By convention, constructors in JavaScript begin with a capital letter to distinguish them from non-constructor functions.

The following code creates a generic object and stores a reference to it in myObject:


var myObject = new Object(); 

console.log(typeof myObject);

The code above generates the following result.

Reference typed variable holds a pointer to the location in memory for the object.

The primitive typed value is stored directly in the variable.

When assigning an object to a variable, the pointer is assigned.

When assigning one variable to another for reference type, each variable gets a copy of the pointer, and they reference the same object in memory.

For example:


var object1 = new Object(); 
var object2 = object1; 

This code first creates an object with new operator and stores a reference in object1.

Then, we defined another variable object2 which is assigned the value of object1.

After the assignment there is still only one instance of the object that was created.

Both object1 and object2 variables point to the same object.





Adding or Removing Properties

We can add and remove properties at any time for JavaScript objects.

For example:

   
var object1 = new Object(); 
var object2 = object1; 

object1.myValue = "CSS"; 
console.log(object2.myValue);  

The code above generates the following result.

myValue is added to object1 with a value of "CSS".

That property is accessible on object2 because both object1 and object2 point to the same object.

We can modify objects whenever we want in JavaScript.





Property access

Properties are name/value pairs that are stored on an object.

Dot notation is the most common way to access properties in JavaScript.

We can access properties on JavaScript objects by using bracket notation with a string.

For example, you could write this code, which uses dot notation:


var array = []; 
array.push(1); 
console.log(array);

The code above generates the following result.

With bracket notation, the name of the method is included in a string enclosed by square brackets, as in this example:


var array = []; 
array["push"](1); 
console.log(array);

The code above generates the following result.

This syntax above is useful when dynamically referencing property to access.

The following code uses bracket notation to reference a variable instead of the string literal to specify the property to access.


var array = []; 
var method = "push"; 
array[method](1); 

console.log(array);

In the code above, the variable method has a value of "push", so push() is called on the array.

The bracket notation can use special characters in property names.