Simplify JavaScript Object Oriented Programming Model: Part 2

Introduction

The previous article introduced how to write readable code using the JavaScript OOP model. I highly recommend you read the previous article Simplify JavaScript Object-Oriented Programming Model: Part 1 before this one since this article highly depends on the first. This article introduces objects and methods in JavaScript.

Object in JavaScript

In JavaScript, everything is an object except primitive data types. A variable contains a value and that value can vary. Whereas an object contains many values and the values will be in a name/value pair. An object can have properties and methods. An object method is also an object property containing a function definition. You can declare a JavaScript variable as in the following way that shows a variable can have only one value.

• Object Literal
• New Operator
• Object Constructor

So let's see each one by one.

Object Literal

The student object has properties and methods as shown in the preceding example. Both name and city are properties whereas show is a method because it contains a function definition for it. Here this is an object itself, in other words this is used in the method then its value is the object itself. Now I wonder that you have understood how to declare a variable and object in JavaScript so it's time to access properties and methods of an object. You can access the student object property in one of the following two ways:

1. The first one is using the dot operator (.), for example:
   console.log(student.name);
   
   
2. Another way is using the property name as the index such as:
   console.log(student["city"]);

Moreover you can access an object method using the dot (.) operator as shown for the student object's show() method in the following code snippet. console.log(student.show());

New Operator

Both are ways to create a JavaScript object and only create a single object, in other words you can't create many objects of one type. Both approaches are nearly the same but the first approach (object literal) is better than approach two (the new operator) because the object literal method has high execution speed and readability.

Object Constructor

Since both of the preceding approaches create only a single object of the type, we often need more than one object of a type and that's why we used the third approach (object constructor). In this approach, we define the object definition once to meet each specific instance's need and use it multiple times. An object constructor is merely a regular JavaScript function but it's called via a new operator.