JavaScript Object-Oriented Programming (OOP) – Building Real-World Applications

In the previous article, we learned about Error Handling and Debugging. As applications grow larger, managing code becomes more difficult. Imagine creating software for:

• A school management system

• A banking application

• An online shopping website

• A hospital management system

Writing everything using variables and functions alone becomes complicated.

To solve this problem, programmers use Object-Oriented Programming (OOP).

OOP helps organize code into objects that represent real-world entities.

In this article, we will learn:

• What OOP is

• Why OOP is important

• Classes and Objects

• Constructors

• Encapsulation

• Inheritance

• Polymorphism

• Abstraction

• Real-world examples

---

What is Object-Oriented Programming?

Object-Oriented Programming (OOP) is a programming paradigm that organizes code into objects.

An object contains:

Properties (Data)

Methods (Functions)

---

Real-Life Example

Consider a Car.

A car has:

Properties

Brand

Color

Model

Speed

and

Behaviors

Start()

Stop()

Accelerate()

In OOP:

Car → Object

---

Why OOP is Needed

Without OOP:

let name = "Rahul";

let age = 20;

function study()
{
}

Managing thousands of students becomes difficult.

---

With OOP:

Student Object

contains everything related to a student.

---

Benefits of OOP

• Better organization

• Reusable code

• Easier maintenance

• Real-world modeling

• Reduced duplication

---

What is a Class?

A class is a blueprint for creating objects.

Think of it as a design.

Example:

Blueprint of House
      ↓
Many Houses Created

Similarly:

Class
      ↓
Objects

---

Class Syntax

class Student
{

}

This creates a class named Student.

---

What is an Object?

An object is an instance of a class.

Example:

let s1 =
new Student();

Here:

Student → Class

s1 → Object

---

Class and Object Relationship

Class

↓

Object 1

Object 2

Object 3

One class can create many objects.

---

Creating a Simple Class

Example:

class Student
{
    name = "Rahul";

    age = 20;
}

---

Creating Object

let s1 =
new Student();

console.log(
s1.name
);

Output:

Rahul

---

Complete Example

class Student
{
    name = "Rahul";

    age = 20;
}

let s1 =
new Student();

console.log(
s1.name
);

console.log(
s1.age
);

Output:

Rahul

20

---

Constructor Method

A constructor initializes object data.

It runs automatically when an object is created.

---

Syntax

constructor()
{

}

---

Example

class Student
{
    constructor()
    {
        console.log(
        "Object Created"
        );
    }
}

let s1 =
new Student();

Output:

Object Created

---

Constructor with Parameters

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

        this.age = age;
    }
}

---

Creating Objects

let s1 =
new Student(
"Rahul",
20
);

let s2 =
new Student(
"Amit",
22
);

---

Accessing Data

console.log(
s1.name
);

Output:

Rahul

---

Understanding this Keyword

this refers to the current object.

Example:

this.name

means:

Current Object's Name

---

Complete Constructor Example

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

        this.age = age;
    }
}

let s1 =
new Student(
"Rahul",
20
);

console.log(
s1.name
);

console.log(
s1.age
);

Output:

Rahul

20

---

Methods in Classes

Methods define object behavior.

Example:

class Student
{
    greet()
    {
        console.log(
        "Hello"
        );
    }
}

---

Calling Method

let s1 =
new Student();

s1.greet();

Output:

Hello

---

Example with Data

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

    greet()
    {
        console.log(
        "Hello " +
        this.name
        );
    }
}

let s1 =
new Student(
"Rahul"
);

s1.greet();

Output:

Hello Rahul

---

Four Pillars of OOP

Object-Oriented Programming is based on:

1. Encapsulation

2. Inheritance

3. Polymorphism

4. Abstraction

---

1. Encapsulation

Encapsulation means:

Binding Data and Methods Together

inside a single unit (object).

---

Example

class BankAccount
{
    constructor(balance)
    {
        this.balance =
        balance;
    }

    deposit(amount)
    {
        this.balance +=
        amount;
    }
}

Data and methods are combined.

---

Benefits of Encapsulation

• Data protection

• Better security

• Improved maintainability

---

2. Inheritance

Inheritance allows one class to acquire properties and methods of another class.

---

Real-Life Example

Animal

↓

Dog

Dog inherits characteristics of Animal.

---

Syntax

class Dog
extends Animal
{

}

---

Example

class Animal
{
    eat()
    {
        console.log(
        "Eating"
        );
    }
}

class Dog
extends Animal
{

}

---

Using Inherited Method

let d =
new Dog();

d.eat();

Output:

Eating

---

Why Inheritance?

Without inheritance:

Same Code Repeated

With inheritance:

Code Reused

---

Example

class Animal
{
    eat()
    {
        console.log(
        "Eating"
        );
    }
}

class Dog
extends Animal
{
    bark()
    {
        console.log(
        "Barking"
        );
    }
}

let d =
new Dog();

d.eat();

d.bark();

Output:

Eating

Barking

---

3. Polymorphism

Polymorphism means:

One Interface

Multiple Forms

---

Example

class Animal
{
    sound()
    {
        console.log(
        "Animal Sound"
        );
    }
}

---

Overriding Method

class Dog
extends Animal
{
    sound()
    {
        console.log(
        "Bark"
        );
    }
}

---

Example

let d =
new Dog();

d.sound();

Output:

Bark

Method behavior changed.

---

4. Abstraction

Abstraction means:

Showing Important Details

Hiding Internal Details

---

Real-Life Example

Car Steering

You use it without knowing engine mechanics.

---

Example

class Car
{
    start()
    {
        console.log(
        "Car Started"
        );
    }
}

User only uses:

car.start();

Internal details remain hidden.

---

Getter and Setter Methods

Used to control access to data.

---

Getter

get name()
{
    return this._name;
}

---

Setter

set name(value)
{
    this._name =
    value;
}

---

Example

class Student
{
    set name(value)
    {
        this._name =
        value;
    }

    get name()
    {
        return this._name;
    }
}

let s =
new Student();

s.name =
"Rahul";

console.log(
s.name
);

Output:

Rahul

---

Practical Program – Employee Class

class Employee
{
    constructor(
    name,
    salary
    )
    {
        this.name =
        name;

        this.salary =
        salary;
    }

    display()
    {
        console.log(
        this.name
        );

        console.log(
        this.salary
        );
    }
}

let emp =
new Employee(
"Amit",
50000
);

emp.display();

Output:

Amit

50000

---

Practical Program – Bank Account

class BankAccount
{
    constructor(balance)
    {
        this.balance =
        balance;
    }

    deposit(amount)
    {
        this.balance +=
        amount;
    }

    showBalance()
    {
        console.log(
        this.balance
        );
    }
}

let account =
new BankAccount(
1000
);

account.deposit(
500
);

account.showBalance();

Output:

1500

---

Complete OOP Program

<!DOCTYPE html>

<html>

<body>

<script>

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

        this.age = age;
    }

    show()
    {
        document.write(
        this.name
        );

        document.write("<br>");

        document.write(
        this.age
        );
    }
}

let s1 =
new Student(
"Rahul",
20
);

s1.show();

</script>

</body>

</html>

Output:

Rahul

20

---

OOP vs Traditional Programming

Traditional	OOP
Function Based	Object Based
Less Reusable	Highly Reusable
Hard to Manage	Easy to Manage
Less Secure	More Secure

---

Real-Life Applications

OOP is used in:

• Banking systems

• School management systems

• Hospital software

• Games

• E-commerce applications

• Mobile applications

Frameworks like Angular and libraries like React heavily use OOP concepts.

---

Common Mistakes Beginners Make

Forgetting new Keyword

Wrong:

let s =
Student();

Correct:

let s =
new Student();

---

Misusing this

Wrong:

name = name;

Correct:

this.name = name;

---

Not Understanding Inheritance

Remember:

Child Class

inherits

Parent Class

---

Advantages of OOP

• Reusable code

• Better organization

• Easy maintenance

• Real-world representation

• Improved scalability

---

Conclusion

Object-Oriented Programming is one of the most important concepts in modern JavaScript development. It helps developers create organized, reusable, and scalable applications.