Skip to main content

Command Palette

Search for a command to run...

Introduction to Object-Oriented Programming (OOP) in JavaScript

Updated
•4 min read•View as Markdown
Introduction to Object-Oriented Programming (OOP) in JavaScript

As applications grow larger, writing organized and reusable code becomes very important. One programming approach that helps with this is Object-Oriented Programming (OOP).

In this blog, we’ll understand what OOP means, how classes work in JavaScript, and how we can create objects using classes.

What is Object-Oriented Programming?

Object-Oriented Programming (OOP) is a programming style where we organize code using objects.

An object represents something from the real world and contains:

  • Properties → data about the object

  • Methods → actions the object can perform

For example, a car might have:

  • Properties → brand, color, speed

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

OOP helps us write clean, reusable, and structured code.

Real-World Analogy: Blueprint and Objects

A good way to understand OOP is by thinking about a blueprint.

Imagine a car blueprint used in a factory.

  • The blueprint defines what a car should look like.

  • Using that blueprint, we can build many cars.

Programming works in a similar way.

  • Class → blueprint

  • Object → actual item created from the blueprint

Example:

Blueprint (Class) → Car
Objects → Car1, Car2, Car3

Each car is created from the same blueprint but can have different values like color or model.

What is a Class in JavaScript?

A class is a template used to create objects.

It defines the structure and behavior that objects created from it will have.

Example:

class Person {
  
}

Here, Person is a class that can later be used to create multiple objects.

Creating Objects Using a Class

Once a class is defined, we can create objects using the new keyword.

Example:

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

const person1 = new Person("Sameer", 22, "Delhi");
const person2 = new Person("Rahul", 25, "Mumbai");

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

Here:

  • Person → class

  • person1 and person2 → objects created from the class

The Constructor Method

The constructor is a special method inside a class.

It runs automatically whenever a new object is created.

Its main purpose is to initialize object properties.

Example:

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

const person = new Person("Sameer", 22);

Explanation:

  • this.name refers to the object's name

  • this.age refers to the object's age

So when we create an object, the values get assigned automatically.

Methods Inside a Class

Classes can also contain methods, which are functions that define behavior.

Example:

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

  introduce() {
    console.log("Hi, my name is " + this.name + " and I am " + this.age + " years old.");
  }
}

const person1 = new Person("Sameer", 22);

person1.introduce();

Output:

Hi, my name is Sameer and I am 22 years old.

Here, introduce() is a method that belongs to the class.

Basic Idea of Encapsulation

Encapsulation means keeping data and related functions together inside a single unit (class).

Instead of spreading data and functions across the program, we group them logically.

Example:

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

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

Here:

  • Properties → brand, color

  • Method → start()

Everything related to the car is kept inside the Car class, making the code easier to manage.

Code Reusability with Classes

One of the biggest advantages of OOP is code reuse.

Instead of writing similar code again and again, we can reuse the same class to create multiple objects.

Example:

const car1 = new Car("Toyota", "Black");
const car2 = new Car("Honda", "White");
const car3 = new Car("BMW", "Blue");

All these objects are created from the same class.

Conclusion

Object-Oriented Programming helps developers organize code in a clear and reusable way.

Key things to remember:

  • OOP organizes programs using objects.

  • A class acts as a blueprint.

  • Objects are created using the new keyword.

  • The constructor initializes object properties.

  • Methods define actions that objects can perform.

  • Encapsulation keeps related data and behavior together.

Learning these basics will make it easier to build larger and more structured JavaScript applications.