Skip to main content

Command Palette

Search for a command to run...

Object-Oriented Programming (OOP) in JavaScript Explained for Beginners

Updated
4 min readView as Markdown

Understanding Object-Oriented Programming (OOP) in JavaScript

When programs become larger, managing variables and functions separately can become messy. Object-Oriented Programming (OOP) helps us organize code in a structured and reusable way.

In JavaScript, OOP allows us to create objects that contain both data (properties) and behavior (methods).

This makes code easier to maintain, reuse, and understand.


What is Object-Oriented Programming?

Object-Oriented Programming is a programming style where we structure code using objects.

An object typically contains:

Properties → data about the object
Methods → actions the object can perform

For example:

let person = {
  name: "Rahul",
  age: 22,
  greet() {
    console.log("Hello!");
  }
};

Here:

  • name and age are properties

  • greet() is a method

OOP helps group related data and functionality together.


Real-World Analogy: Blueprint → Objects

Think about how cars are made.

A blueprint defines how a car should look and behave:

  • brand

  • color

  • engine type

  • speed

But the blueprint itself is not an actual car.

Using that blueprint, factories can create many cars.

Blueprint → Car Design

Objects created from blueprint:
Car 1 → Red Toyota
Car 2 → Blue Honda
Car 3 → Black BMW

In programming terms:

Class → Blueprint

Object → Actual item created from the blueprint


What is a Class in JavaScript?

A class is a template used to create objects.

It defines the structure and behavior that objects will have.

Example:

class Person {

}

Right now the class is empty.

Next, we add properties and methods.


The Constructor Method

The constructor is a special method that runs automatically when a new object is created.

It is used to initialize properties.

Example:

class Person {

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

}

Explanation:

  • constructor() runs when a new object is created

  • this refers to the current object

  • we assign values to object properties


Creating Objects from a Class

Objects are created using the new keyword.

class Person {

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

}

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

Now we have two objects:

person1 → { name: "Rahul", age: 22 }
person2 → { name: "Anita", age: 25 }

Both objects were created using the same class.


Methods Inside a Class

Classes can also contain methods, which define behavior.

Example:

class Person {

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

  introduce() {
    console.log("Hi, my name is " + this.name);
  }

}

Using the method:

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

person1.introduce();

Output:

Hi, my name is Rahul

Methods allow objects to perform actions.


Basic Idea of Encapsulation

Encapsulation means combining data and behavior in a single structure.

Instead of storing data and functions separately, they are grouped together inside a class.

Example:

class Car {

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

  accelerate() {
    this.speed += 10;
    console.log(this.brand + " speed is now " + this.speed);
  }

}

Here:

  • brand and speed → data

  • accelerate() → behavior

Everything related to the Car is contained inside one structure.

This keeps code organized and easier to maintain.


Why OOP is Useful

Object-Oriented Programming helps in several ways.

Code Reusability

We can create many objects from the same class.

Better Organization

Related data and behavior stay together.

Easier Maintenance

When projects grow, structured code is easier to manage.


Assignment

Create a Student class with the following requirements.

Properties

  • name

  • age

Method

  • printDetails()

Expected output example:

Name: Rahul
Age: 20

Create multiple student objects and call the method.


Example Solution

class Student {

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

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

}

let student1 = new Student("Rahul", 20);
let student2 = new Student("Anita", 21);

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

Simple Diagram

Class (Blueprint)

        Student
   -----------------
   name
   age
   printDetails()

        ↓

Objects (Instances)

student1 → { name: "Rahul", age: 20 }
student2 → { name: "Anita", age: 21 }