Introduction to Object-Oriented Programming (OOP) in JavaScript
When I first started learning programming, I noticed that many real-world things can be represented in code. For example, a car has properties like color and brand, and it can perform actions like starting or stopping.
This idea is exactly what Object-Oriented Programming (OOP) is about.
OOP helps us organize code by modeling real-world entities using objects.
In this article, I’ll explain:
What Object-Oriented Programming (OOP) means
A simple real-world analogy
What a class is in JavaScript
How to create objects using classes
The constructor method
Methods inside a class
A basic idea of encapsulation
Let’s start with a simple analogy.
A Simple Real-World Analogy: Blueprint → Objects
Think about building cars in a factory.
Before any car is made, engineers design a blueprint.
That blueprint describes:
what properties a car has (color, brand, speed)
what actions it can perform (start, stop, accelerate)
From the same blueprint, we can create many cars.
For example:
Car 1 → Red Toyota
Car 2 → Blue BMW
Car 3 → Black Tesla
In programming:
Blueprint = Class
Actual cars = Objects
So a class defines the structure, and objects are instances created from that class.
What is a Class in JavaScript?
A class is like a blueprint for creating objects.
It defines:
properties (data)
methods (functions related to that object)
Here is a simple example.
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
In this code:
class Person→ creates a classconstructor()→ runs when an object is createdthis.nameandthis.age→ properties of the object
But this class alone does nothing until we create objects from it.
Creating Objects Using Classes
To create an object from a class, we use the new keyword.
Example:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
const person1 = new Person("Dipan", 22);
const person2 = new Person("Rahul", 21);
console.log(person1);
console.log(person2);
Here we created two objects:
person1person2
Both follow the same structure defined by the class, but they store different values.
This shows one of the biggest advantages of OOP:
👉 Code reusability
We write the class once and create multiple objects from it.
The Constructor Method
The constructor is a special method inside a class.
It automatically runs when a new object is created.
Example:
class Car {
constructor(brand, color) {
this.brand = brand;
this.color = color;
}
}
const car1 = new Car("Toyota", "Red");
When we run this:
new Car("Toyota", "Red");
JavaScript automatically calls:
constructor("Toyota", "Red")
and assigns the values to the object.
So the constructor helps us initialize object properties.
Methods Inside a Class
Classes can also contain methods, which are functions that belong to the object.
Example:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
greet() {
console.log("Hello, my name is " + this.name);
}
}
const person1 = new Person("Dipan", 22);
person1.greet();
Output:
Hello, my name is Dipan
Here:
greet()is a methodIt can access object properties using
this
Methods allow objects to perform actions.
Basic Idea of Encapsulation
Encapsulation means keeping data and related functions together inside a class.
Instead of writing separate variables and functions everywhere, we organize them inside a class.
Example without OOP:
let name = "Dipan";
let age = 22;
function printDetails() {
console.log(name + " is " + age + " years old");
}
With OOP:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
printDetails() {
console.log(this.name + " is " + this.age + " years old");
}
}
Now the data and behavior belong to the same object.
This makes code:
cleaner
easier to maintain
more organized
Assignment Example: Student Class
Let’s build a simple example step by step.
We will:
Create a
StudentclassAdd properties
nameandageAdd a method to print student details
Create multiple student objects
Step 1: Create the Class
class Student {
constructor(name, age) {
this.name = name;
this.age = age;
}
printDetails() {
console.log("Student Name: " + this.name);
console.log("Age: " + this.age);
}
}
Step 2: Create Student Objects
const student1 = new Student("Dipan", 22);
const student2 = new Student("Rahul", 21);
const student3 = new Student("Ankit", 23);
Step 3: Call the Method
student1.printDetails();
student2.printDetails();
student3.printDetails();
Output:
Student Name: Dipan
Age: 22
Student Name: Rahul
Age: 21
Student Name: Ankit
Age: 23
Here we created multiple student objects using the same class.
This shows how powerful and reusable classes are.
Why OOP is Useful
Object-Oriented Programming helps us:
Model real-world entities in code
Reuse code using classes
Organize data and behavior together
Make programs easier to maintain
Many modern frameworks and applications rely heavily on OOP concepts.
