JavaScript Objects

JavaScript's most often used and most fundamental data type is the Object data type. JavaScript has one complex data type, the Object data type, and it has five simple data types: Number, String, Boolean, Undefined, and Null. Note that these simple (primitive) data types are immutable, they cannot be changed, while objects are mutable.

What is an Object

An object is a list of primitives stored as name-value pairs. Each item in the list is called a property (functions are called methods) and each property name must be unique and can be a string or a number.

The following is a simple object:

var object = {employeeName: "Roger", Department: "IT"};

To iterate: We can think of an object as a list that contains items and each item (a property) in the list is stored by a name-value pair. The property names in the example above are employeeName and Department. And the values for each are “Roger” and “IT”.
Property names can be a string or a number, but if the property name is a number then it must be accessed with the bracket notation. More on bracket notation later. Here is another example of objects with numbers as the property name:

var starRating = {1: "Very Poor", 2:"Poor",3: "Average", 4:"Good", 5:"Excellent"};

console.log(starRating .3) // This will throw an error

// This is how you will access the value of the property 3, to get value "Average"

console.log(ageGroup["3"]); // Average

console.log(ageGroup["1"]); // Very Poor

console.log(ageGroup["5"]); // Excellent  

As a JavaScript developer you will most often use the object data type, mostly for storing data and for creating your own custom methods and functions.

Reference Data Type and Primitive Data Types

One of the main differences between a reference data type and a primitive data type is that a reference data type's value is stored as a reference, it is not stored directly in the variable, as a value, as the primitive data types are.

For example

// The primitive data type String is stored as a value

var employee = "Roger";

var anotherEmployee = employee ; // anotherEmployee = the value of employee

employee = "Dominic"; // value of employee changed

console.log(anotherEmployee ); // Roger

console.log(employee ); // Dominic

It is worth noting that even though we changed person to “Dominic,” the anotherEmployee variable still retains the value that employee had.

Compare the primitive data saved-as-value demonstrated above with the save-as-reference for objects:

var employee = {name: "Roger"};

var anotherEmployee = employee ;

employee .name = "Dominic";

console.log(anotherEmployee .name); // Dominic

console.log(employee .name); // Dominic

In this example, we copied the employee object to anotherEmployee, but because the value in employee was stored as a reference and not an actual value, when we changed the employee.name property to “Dominic” the anotherEmployee reflected the change because it never stored an actual copy of it's own value of the employee's properties, it only had a reference to it.

I have tried to cover most basic features that will help to start with JavaScript objects.

Thanks for your reading. Please provide your inputs and suggestions for the article.

Up Next
    Ebook Download
    View all
    Learn
    View all