Skip to main content

Command Palette

Search for a command to run...

Understanding Object-Oriented Programming in JavaScript

Object-Oriented Programming (OOP) in JavaScript: A Complete Beginner Guide

Updated
7 min read
Understanding Object-Oriented Programming in JavaScript
R

Software engineer passionate about tech, innovation & research. I explore, build, and share insights on coding, systems, and emerging technologies.

Introduction

As JavaScript applications grow larger, organizing code becomes increasingly important. Writing logic in a random or unstructured way can make programs difficult to understand, maintain, and extend. Developers need a structured approach that keeps related data and functionality together.

Object-Oriented Programming (OOP) provides this structure. It allows developers to design programs using objects that represent real-world entities. By organizing code around objects, classes, and methods, programs become easier to manage and reuse.

JavaScript supports Object-Oriented Programming through classes and objects. These features allow developers to define blueprints for objects, create multiple instances from those blueprints, and combine data with behavior.

In this guide, we will explore the core concepts of Object-Oriented Programming in JavaScript. The discussion will cover what OOP means, how classes and objects work, the role of constructors and methods, and the four main principles of OOP: abstraction, encapsulation, inheritance, and polymorphism.

What Object-Oriented Programming (OOP) Means

Object-Oriented Programming is a programming style where software is organized around objects instead of only functions and logic.

An object typically represents something from the real world and contains:

  • Properties (data)

  • Methods (functions that define behavior)

OOP helps developers build programs in a way that mirrors real-world systems. Instead of writing unrelated functions, developers create objects that combine both data and behavior.

The basic workflow of OOP involves:

  • Creating a class that defines the structure

  • Creating objects from that class

  • Allowing those objects to perform actions using methods

This structure improves readability, maintainability, and scalability of code.

Real-World Analogy: Blueprint and Objects

A useful way to understand Object-Oriented Programming is through a real-world analogy.

Imagine a company that manufactures laptops. Before producing any laptops, engineers design a blueprint that describes the laptop's structure, such as its screen size, processor, and battery.

Once the blueprint is ready, the factory can produce many laptops based on the same design.

In programming terms:

  • Class → Blueprint

  • Object → Actual product created from the blueprint

For example:

Class: Laptop design
Objects: Individual laptops produced using that design

Each laptop object may have different values such as serial number or storage capacity, but they all follow the same structure defined by the blueprint.

What Is a Class in JavaScript

A class in JavaScript acts as a blueprint for creating objects. It defines the structure and behavior that objects created from it will have.

A class usually contains:

  • Properties that store data

  • Methods that define actions

Example of a simple class:

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

In this example:

  • Person is the class.

  • constructor is a special method used to initialize object properties.

  • this.name and this.age represent the properties of each object created from the class.

The class itself does not create objects automatically. It only defines the blueprint for them.

Creating Objects Using Classes

Objects are created from classes using the new keyword. When new is used, JavaScript creates a new instance of the class.

Example:

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

let person1 = new Person("Rochak", 25);
let person2 = new Person("Mohit", 28);

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

Output

Person { name: 'Rochak', age: 25 }
Person { name: 'Mohit', age: 28 }

Each object stores its own data while following the structure defined by the class.

The Constructor Method

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

Its purpose is to initialize the object's properties with the values provided during creation.

Example:

class Product {
  constructor(name, price) {
    this.name = name;
    this.price = price;
  }
}

let item = new Product("Phone", 30000);

console.log(item);

Output

Product { name: 'Phone', price: 30000 }

Here, the constructor assigns the provided values to the object's properties using the this keyword.

Methods Inside a Class

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

While properties store data, methods define actions that the object can perform.

Example:

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

  showDetails() {
    console.log("Name:", this.name);
    console.log("Grade:", this.grade);
  }
}

let student1 = new Student("Rochak", "A");

student1.showDetails();

Output

Name: Rochak
Grade: A

The showDetails() method belongs to the class and can be used by any object created from the class.

Why Object-Oriented Programming Is Useful

One of the main benefits of Object-Oriented Programming is code reusability.

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

Advantages of OOP include:

  • Organized code structure

  • Reduced repetition

  • Easier maintenance

  • Better scalability for large applications

By modeling real-world entities with objects, programs become more intuitive and easier to manage.

Abstraction

Abstraction means hiding complex implementation details and exposing only the essential features to the user.

Users interact with the system without needing to understand the internal logic.

Example:

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

  deposit(amount) {
    this.balance += amount;
    console.log("Deposit successful");
  }

  getBalance() {
    console.log("Current balance:", this.balance);
  }
}

let account = new BankAccount("Rohan", 5000);

account.deposit(2000);
account.getBalance();

Output

Deposit successful
Current balance: 7000

The user interacts with simple methods like deposit() and getBalance() without knowing how the internal operations are performed.

Encapsulation

Encapsulation means combining data and methods into a single unit, usually a class.

This keeps related functionality together and helps protect the internal state of objects.

Example:

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

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

let car1 = new Car("Toyota", 60);

car1.accelerate();

Output

Toyota speed is now 70

The data (model, speed) and behavior (accelerate()) are combined within the class.

Inheritance

Inheritance allows one class to inherit properties and methods from another class. This promotes code reuse and helps build relationships between classes.

Example:

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

  speak() {
    console.log(this.name + " makes a sound");
  }
}

class Dog extends Animal {
  bark() {
    console.log(this.name + " barks");
  }
}

let dog1 = new Dog("Bruno");

dog1.speak();
dog1.bark();

Output

Bruno makes a sound
Bruno barks

The Dog class inherits the name property and speak() method from the Animal class.

Polymorphism

Polymorphism means that a method can behave differently depending on the object that calls it.

Different classes can implement the same method in their own way.

Example:

class Animal {
  speak() {
    console.log("Animal makes a sound");
  }
}

class Cat extends Animal {
  speak() {
    console.log("Cat meows");
  }
}

class Cow extends Animal {
  speak() {
    console.log("Cow moos");
  }
}

let cat = new Cat();
let cow = new Cow();

cat.speak();
cow.speak();

Output

Cat meows
Cow moos

Even though the method name is the same, each class provides its own behavior.

Summary of OOP Concepts

Concept Meaning
Abstraction Hiding internal complexity and exposing only necessary features
Encapsulation Combining data and methods into one unit
Inheritance Allowing one class to inherit properties and methods from another
Polymorphism Same method behaving differently in different objects

Conclusion

Object-Oriented Programming provides a structured and organized way to write JavaScript code. By using classes, constructors, and methods, developers can model real-world entities and build reusable components.

The key concepts of OOP include abstraction, encapsulation, inheritance, and polymorphism. These principles help developers design programs that are easier to understand, maintain, and extend.

For beginners learning JavaScript, it is important to focus first on understanding how classes create objects, how constructors initialize data, and how methods define behavior. Once these foundations are clear, learning more advanced programming patterns becomes much easier.

Understanding Object-Oriented Programming in JavaScript