Skip to main content

Command Palette

Search for a command to run...

Understanding Object-Oriented Programming in JavaScript

Updated
5 min read

Object-Oriented Programming (OOP) is a programming style that helps developers organize code using objects and classes. It makes programs easier to understand, reuse, and maintain. Many modern programming languages use OOP, including JavaScript.

In this blog, we will understand the basic concepts of Object-Oriented Programming in JavaScript in a simple and beginner-friendly way.


What is Object-Oriented Programming (OOP)?

Object-Oriented Programming is a way of writing programs using objects that represent real-world things.

Instead of writing separate pieces of code again and again, OOP allows us to group data and functions together inside objects.

Example

Think about a student in a college.

A student has:

  • Name

  • Age

  • Roll number

And a student can perform actions like:

  • Study

  • Attend class

  • Submit assignments

In programming, we represent this using an object.

So an object contains:

  • Properties → Data (name, age)

  • Methods → Actions (study, print details)


Real-World Analogy: Blueprint → Objects

The easiest way to understand OOP is by using a blueprint analogy.

Example: Car

A car blueprint defines:

  • Color

  • Model

  • Engine

  • Speed

Using the blueprint, we can create many cars.

Blueprint Real Object
Car design Honda Car
Car design Toyota Car
Car design Tesla Car

In programming:

  • Blueprint = Class

  • Real Car = Object

So a class is a template used to create objects.


What is a Class in JavaScript?

A class is a blueprint used to create objects.

It defines:

  • Properties (data)

  • Methods (functions)

Basic Syntax

class ClassName {
  constructor(parameters) {
    this.property = value;
  }

  methodName() {
    // code
  }
}

Creating a Simple Class

Let’s create a simple Person class.

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

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

Explanation

  • class Person → defines a class

  • constructor() → special method used to initialize values

  • this.name and this.age → properties

  • greet() → method inside the class


Creating Objects from a Class

Objects are created using the new keyword.

let person1 = new Person("Rahul", 20);
let person2 = new Person("Anita", 22);

Now we have two objects created from the same class.

Using Methods

person1.greet();
person2.greet();

Output

Hello, my name is Rahul
Hello, my name is Anita

This shows how one class can create multiple objects.


Understanding the Constructor Method

The constructor is a special method inside a class.

It runs automatically when an object is created.

It is mainly used to initialize object properties.

Example

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

Creating objects:

let car1 = new Car("Toyota", "Black");
let car2 = new Car("BMW", "White");

Now:

car1.brand → Toyota
car2.color → White

Methods Inside a Class

Methods are functions defined inside a class.

They describe actions that objects can perform.

Example

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

  start() {
    console.log(this.brand + " car is starting");
  }
}

Using the method:

let car1 = new Car("Honda");

car1.start();

Output

Honda car is starting

Basic Idea of Encapsulation

Encapsulation means bundling data and methods together inside a class.

Instead of keeping everything separate, OOP keeps related things organized inside one structure.

Example

Student object contains:

  • name

  • age

  • roll number

  • methods like printDetails()

All these are encapsulated inside one class.

Benefits:

  • Better organization

  • Easier maintenance

  • Improved readability


Why Use Object-Oriented Programming?

OOP makes programming easier and more powerful.

Advantages

1. Code Reusability

Write a class once and create many objects.

2. Better Structure

Large programs become easier to manage.

3. Real-World Modeling

Objects represent real-world entities.

4. Easier Maintenance

Changes can be made inside a class without affecting other code.


Example: Student Class

Let’s build a simple Student class.

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

  printDetails() {
    console.log("Name: " + this.name);
    console.log("Age: " + this.age);
  }
}

Creating Multiple Students

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

Calling Method

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

Output

Name: Aman
Age: 20

Name: Priya
Age: 21

Name: Rahul
Age: 19

Visualizing Class → Object Relationship

        CLASS (Blueprint)
           Student
        ┌─────────────┐
        │ name        │
        │ age         │
        │ printDetails│
        └──────┬──────┘
               │
     ┌─────────┼─────────┐
     │         │         │
  student1  student2  student3
   (Aman)    (Priya)    (Rahul)

A single class creates many objects.


Assignment

Try this exercise to practice.

Task

  1. Create a class called Student

  2. Add properties:

    • name

    • age

  3. Add a method:

    • printDetails()
  4. Create three student objects

  5. Print their details.

Expected Example

Name: Riya
Age: 20

Conclusion

Object-Oriented Programming helps developers write clean, reusable, and organized code. In JavaScript, classes make it easier to create objects and structure applications.

Key takeaways:

  • Class → Blueprint

  • Object → Instance of class

  • Constructor → Initializes properties

  • Methods → Functions inside class

  • Encapsulation → Data and functions grouped together

Once you understand these basics, you can move to advanced OOP concepts like inheritance and polymorphism.