Understanding Object-Oriented Programming in JavaScript

As JavaScript programs grow larger, managing code using only variables, functions, and basic objects can become difficult. Developers need a way to organize code so that related data and functionality stay together.

This is where Object-Oriented Programming (OOP) comes in.

Object-Oriented Programming is a programming approach that helps structure code using objects and classes. It allows developers to model real concepts in code and reuse logic more efficiently.

Instead of writing unrelated pieces of code everywhere, OOP groups data and behavior together in a structured way.

What Object-Oriented Programming Means

In simple terms, Object-Oriented Programming is a way of organizing code using objects.

An object usually contains:

• Properties → data related to the object

• Methods → functions that perform actions related to that data

For example, an object representing a student may contain:

• name

• age

• course

It may also have functions such as:

• displaying student information

• updating details

OOP helps keep this information organized inside a single structure.

Blueprint and Objects

A useful way to understand OOP is through the idea of a blueprint.

A blueprint describes how something should be created. Using that blueprint, multiple actual objects can be built.

In JavaScript:

• A class acts like a blueprint.

• An object is created using that blueprint.

One class can be used to create many objects, each with its own values.

What is a Class in JavaScript

A class in JavaScript is a template used to create objects.

Inside a class, developers define:

• the properties objects should have

• the methods objects can use

A simple class structure looks like this:

class Person {

}

Right now this class doesn't contain anything yet. It only defines a structure where properties and methods can be added.

The Constructor Method

Inside a class, JavaScript commonly uses a constructor method.

The constructor runs automatically whenever a new object is created. Its job is to initialize the object's properties.

Example:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

Here:

• name and age are parameters passed when creating the object

• this.name and this.age store those values inside the object

The keyword this refers to the object currently being created.

Creating Objects from a Class

Once a class is defined, objects can be created using the new keyword.

Example:

let person1 = new Person("Saleh", 20);
let person2 = new Person("Sara", 22);

Now two different objects exist.

Each object stores its own values.

console.log(person1.name);
console.log(person2.age);

Output:

Saleh
22

Both objects were created from the same class, but they contain different data.

Methods Inside a Class

A class can also contain methods. Methods are functions that belong to objects created from the class.

Example:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  displayInfo() {
    console.log(this.name + " is " + this.age + " years old");
  }
}

Now an object can call this method.

let person1 = new Person("Ali", 20);

person1.displayInfo();

Output:

Ali is 20 years old

The method uses this to access the object's own properties.

Basic Idea of Encapsulation

Encapsulation means keeping related data and functions together inside a single structure.

In OOP, this is done using classes.

Example:

class Car {
  constructor(brand, speed) {
    this.brand = brand;
    this.speed = speed;
  }

  showDetails() {
    console.log(this.brand + " runs at " + this.speed + " km/h");
  }
}

Here the object's data (brand, speed) and its behavior (showDetails) are kept together inside the class.

This makes the program easier to understand and manage.

Why OOP is Useful

One important advantage of Object-Oriented Programming is code reusability.

Instead of rewriting similar logic many times, developers define a class once and then create multiple objects from it.

Example:

let car1 = new Car("Toyota", 180);
let car2 = new Car("Honda", 160);
let car3 = new Car("BMW", 220);

All these objects are created using the same class, but each object stores different values.

This approach helps keep programs organized, scalable, and easier to maintain.

Assignment for Practice

Try implementing a simple example using a class.

Step 1: Create a Student Class

class Student {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  printDetails() {
    console.log(this.name + " is " + this.age + " years old");
  }
}

Step 2: Create Multiple Student Objects

let student1 = new Student("Rahul", 19);
let student2 = new Student("Aisha", 20);
let student3 = new Student("Imran", 21);

Step 3: Call the Method

student1.printDetails();
student2.printDetails();
student3.printDetails();

Example output:

Rahul is 19 years old
Aisha is 20 years old
Imran is 21 years old

Final Thoughts

Object-Oriented Programming is an important concept in JavaScript because it helps organize code in a structured way.