Understanding Object-Oriented Programming in JavaScript

As programs grow larger, writing everything with just variables and functions becomes difficult to manage. Code starts to look messy, and maintaining it becomes harder.

This is where Object-Oriented Programming (OOP) becomes useful.

OOP helps developers structure code in a way that resembles real-world objects, making programs easier to understand, organize, and reuse.

In this article, we will learn the basics of Object-Oriented Programming in JavaScript, starting from simple concepts and moving toward practical examples.

---

1. What Does Object-Oriented Programming Mean?

Object-Oriented Programming is a programming approach where we organize code using objects.

An object represents something from the real world and contains two main things:

1. Properties → Data about the object

2. Methods → Actions the object can perform

For example, think about a car.

A car has:

Properties

• brand

• color

• speed

Methods

• start()

• stop()

• accelerate()

In JavaScript, we can represent this idea like this:

const car = {
  brand: "Toyota",
  color: "Black",
  start() {
    console.log("The car has started");
  }
};

Here:

• brand and color are properties

• start() is a method

This is the basic idea behind object-oriented programming.

---

2. Real-World Analogy: Blueprint → Objects

To understand OOP better, imagine a blueprint used to build cars.

A blueprint describes:

• the structure of the car

• how many wheels it has

• how the engine works

But the blueprint itself is not a real car.

Using that blueprint, a factory can build many different cars.

In programming:

Concept	Meaning
Blueprint	Class
Actual cars	Objects (Instances)

A class acts as a blueprint, and objects are created from that blueprint.

---

3. What is a Class in JavaScript?

A class is a template used to create objects.

It defines:

• what properties objects will have

• what methods they can use

JavaScript introduced the class syntax in ES6.

Example:

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

  start() {
    console.log("The car has started");
  }
}

In this example:

• Car is the class

• It defines the structure of car objects

---

4. Creating Objects Using Classes

Objects are created using the new keyword.

Example:

const car1 = new Car("Toyota", "Black");
const car2 = new Car("Honda", "White");

Now we have two different objects created from the same class.

We can access their properties like this:

console.log(car1.brand);
console.log(car2.color);

Output:

Toyota
White

Even though both objects use the same class, they contain different data.

---

5. The Constructor Method

The constructor is a special method inside a class.

It runs automatically when an object is created.

Its main purpose is to initialize object properties.

Example:

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

When we create a new object:

const person1 = new Person("Rahul", 25);

JavaScript automatically assigns:

this.name = "Rahul"
this.age = 25

So the object now contains those values.

---

6. Methods Inside a Class

Methods are functions defined inside a class that describe behavior of objects.

Example:

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

  introduce() {
    console.log(`Hi, my name is ${this.name}`);
  }
}

Now we create an object and call the method.

const person1 = new Person("Dushyant", 25);

person1.introduce();

Output:

Hi, my name is Dushyant

Methods allow objects to perform actions.

---

7. Basic Idea of Encapsulation

Encapsulation means keeping data and related functions together inside one structure.

Instead of writing separate variables and functions everywhere, we group them inside a class.

Without OOP:

let name = "Rahul";
let age = 22;

function printDetails() {
  console.log(name, age);
}

With OOP:

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

  printDetails() {
    console.log(this.name, this.age);
  }
}

Now everything related to Student stays inside one structure.

This makes code cleaner and easier to maintain.

---

8. Real Example: Students Interacting

To understand this better, let's create a Student class where students can introduce themselves and interact with each other.

Step 1: Create the Student Class

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

  introduce() {
    console.log(`Hi, my name is \({this.name} and I am \){this.age} years old.`);
  }

  interact(otherStudent) {
    console.log(`\({this.name} is interacting with \){otherStudent.name}.`);
  }
}

---

Step 2: Create Student Objects

const dushyant = new Student("Dushyant", 21);
const shubhnhi = new Student("Shubhnhi", 20);
const anita = new Student("Anita", 22);
const davita = new Student("Davita", 21);
const hanneta = new Student("Hanneta", 23);

Each student object has its own name and age.

---

Step 3: Students Introduce Themselves

dushyant.introduce();
shubhnhi.introduce();
anita.introduce();

Output:

Hi, my name is Dushyant and I am 21 years old.
Hi, my name is Shubhnhi and I am 20 years old.
Hi, my name is Anita and I am 22 years old.

---

Step 4: Students Interact

dushyant.interact(shubhnhi);
anita.interact(davita);
hanneta.interact(dushyant);

Output:

Dushyant is interacting with Shubhnhi.
Anita is interacting with Davita.
Hanneta is interacting with Dushyant.

This demonstrates how multiple objects can interact using the same class structure.

---

9. Why OOP is Useful

Object-Oriented Programming offers several benefits.

Code Reusability

A single class can create many objects.

Example:

const student1 = new Student("Aman", 20);
const student2 = new Student("Priya", 21);

---

---

Scalability

Large applications can be expanded easily using classes and ob10. Visual Concept: Class → Objects

Think of it like this:

          Class (Blueprint)
              Student
                |
      -------------------------
      |          |            |
  Dushyant   Shubhnhi      Anita

One class can generate many objects.

---

Key Concepts Recap

Concept	Meaning
Object	Instance representing a real-world entity
Class	Blueprint used to create objects
Constructor	Special method that initializes object properties
Method	Function inside a class
Encapsulation	Bundling data and behavior together