Skip to main content

Command Palette

Search for a command to run...

Understanding Object-Oriented Programming in JavaScript

Updated
•5 min read•View as Markdown
Understanding Object-Oriented Programming in JavaScript

Programming often involves organizing code so it is easy to understand, reuse, and maintain. One of the most common approaches used to achieve this is Object-Oriented Programming (OOP).

JavaScript supports Object-Oriented Programming, which allows developers to model real-world entities using objects, classes, and methods. Instead of writing scattered functions and variables, OOP helps structure code into logical units.

This article introduces the core ideas of OOP in JavaScript using simple examples.

What Object-Oriented Programming (OOP) Means

Object-Oriented Programming is a programming style where software is organized around objects rather than functions and variables alone.

An object represents something with:

  • Properties (data): characteristics of the object

  • Methods (behavior): actions the object can perform

For example, a car can be represented as an object.

  • Properties: color, brand, speed

  • Methods: start(), stop(), accelerate()

Instead of writing separate functions for everything, OOP groups related data and behavior together.

This approach provides several advantages:

  • Better code organization

  • Easier code reuse

  • More maintainable programs

  • Real-world modeling of problems

Real-World Analogy:

A helpful way to understand OOP is through a blueprint analogy.

Imagine a car factory. Before building cars, engineers design a blueprint. The blueprint describes:

  • engine type

  • number of wheels

  • steering system

Using this blueprint, the factory can produce many individual cars.

Each car:

  • follows the blueprint

  • has the same structure

  • is still a separate physical object

In programming:

Concept Real World JavaScript
Blueprint Car design Class
Car built from blueprint Individual car Object
Characteristics color, engine Properties
Actions drive, brake Methods

What Is a Class in JavaScript

A class is a template used to create objects.

It defines:

  • what properties objects will have

  • what methods objects can use

JavaScript introduced the class syntax in ES6 (ECMAScript 2015) to make OOP easier to write and read.

syntax:

class ClassName {
  constructor() {
    // initialization code
  }

  methodName() {
    // behavior
  }
}

A class itself does not represent a real object. Instead, it acts as a template for creating objects.

Creating Objects Using Classes

Once a class is defined, objects can be created from it. Objects created from a class are called instances.

Example:

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

const car1 = new Car("Toyota", "Red");
const car2 = new Car("Honda", "Blue");

Explanation:

  1. Car is the class.

  2. car1 and car2 are objects created from that class.

  3. The new keyword creates a new instance.

Now both objects share the same structure.

Classes are made for code reusability. The class definition is written once, but many objects can be created.


The Constructor Method

The constructor is a special method inside a class.

It runs automatically when a new object is created.

Purpose of the constructor:

  • initialize object properties

  • set starting values

  • prepare the object for use

Example:

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

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

What happens internally:

  1. new Person("Rahul", 25) creates a new object.

  2. The constructor runs.

  3. this.name becomes "Rahul".

  4. this.age becomes 25.

The this keyword refers to the current object being created.

Result:

person1 = {
  name: "Rahul",
  age: 25
}

Without a constructor, properties would have to be assigned manually after object creation.


Methods Inside a Class

Classes can also contain methods. Methods are functions that define what an object can do.

Example:

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

  study() {
    console.log(this.name + " is studying.");
  }

  getMarks() {
    console.log(this.name + " scored " + this.marks);
  }
}

const student1 = new Student("Amit", 90);

student1.study();
student1.getMarks();

Output:

Amit is studying.
Amit scored 90

Important observations:

  • Methods belong to the class

  • Every object created from the class can use them

  • Methods access object data using this

This structure makes code more readable and organized.

Basic Idea of Encapsulation

One important concept in OOP is encapsulation. Encapsulation means keeping related data and behavior together in one unit.

In JavaScript classes:

  • properties store the data

  • methods control how that data is used

Example:

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

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

  withdraw(amount) {
    this.balance -= amount;
  }
}

Here:

  • The balance is stored inside the object.

  • Only methods like deposit() and withdraw() modify it.

Instead of manipulating balance everywhere in the program, access is controlled through methods.

Conclusion

Object-Oriented Programming helps developers structure programs around objects that represent real-world entities.

In JavaScript, the class syntax provides a clear and structured way to implement these ideas. As applications grow larger, OOP becomes an essential tool for managing complexity and building scalable software.

More from this blog