Understanding Object-Oriented Programming in JavaScript
Object-Oriented Programming (OOP) is a programming style that helps developers organize code using objects and classes. It makes programs easier to understand, reuse, and maintain. Many modern programming languages use OOP, including JavaScript.
In this blog, we will understand the basic concepts of Object-Oriented Programming in JavaScript in a simple and beginner-friendly way.
What is Object-Oriented Programming (OOP)?
Object-Oriented Programming is a way of writing programs using objects that represent real-world things.
Instead of writing separate pieces of code again and again, OOP allows us to group data and functions together inside objects.
Example
Think about a student in a college.
A student has:
Name
Age
Roll number
And a student can perform actions like:
Study
Attend class
Submit assignments
In programming, we represent this using an object.
So an object contains:
Properties → Data (name, age)
Methods → Actions (study, print details)
Real-World Analogy: Blueprint → Objects
The easiest way to understand OOP is by using a blueprint analogy.
Example: Car
A car blueprint defines:
Color
Model
Engine
Speed
Using the blueprint, we can create many cars.
| Blueprint | Real Object |
|---|---|
| Car design | Honda Car |
| Car design | Toyota Car |
| Car design | Tesla Car |
In programming:
Blueprint = Class
Real Car = Object
So a class is a template used to create objects.
What is a Class in JavaScript?
A class is a blueprint used to create objects.
It defines:
Properties (data)
Methods (functions)
Basic Syntax
class ClassName {
constructor(parameters) {
this.property = value;
}
methodName() {
// code
}
}
Creating a Simple Class
Let’s create a simple Person class.
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
greet() {
console.log("Hello, my name is " + this.name);
}
}
Explanation
class Person→ defines a classconstructor()→ special method used to initialize valuesthis.nameandthis.age→ propertiesgreet()→ method inside the class
Creating Objects from a Class
Objects are created using the new keyword.
let person1 = new Person("Rahul", 20);
let person2 = new Person("Anita", 22);
Now we have two objects created from the same class.
Using Methods
person1.greet();
person2.greet();
Output
Hello, my name is Rahul
Hello, my name is Anita
This shows how one class can create multiple objects.
Understanding the Constructor Method
The constructor is a special method inside a class.
It runs automatically when an object is created.
It is mainly used to initialize object properties.
Example
class Car {
constructor(brand, color) {
this.brand = brand;
this.color = color;
}
}
Creating objects:
let car1 = new Car("Toyota", "Black");
let car2 = new Car("BMW", "White");
Now:
car1.brand → Toyota
car2.color → White
Methods Inside a Class
Methods are functions defined inside a class.
They describe actions that objects can perform.
Example
class Car {
constructor(brand) {
this.brand = brand;
}
start() {
console.log(this.brand + " car is starting");
}
}
Using the method:
let car1 = new Car("Honda");
car1.start();
Output
Honda car is starting
Basic Idea of Encapsulation
Encapsulation means bundling data and methods together inside a class.
Instead of keeping everything separate, OOP keeps related things organized inside one structure.
Example
Student object contains:
name
age
roll number
methods like printDetails()
All these are encapsulated inside one class.
Benefits:
Better organization
Easier maintenance
Improved readability
Why Use Object-Oriented Programming?
OOP makes programming easier and more powerful.
Advantages
1. Code Reusability
Write a class once and create many objects.
2. Better Structure
Large programs become easier to manage.
3. Real-World Modeling
Objects represent real-world entities.
4. Easier Maintenance
Changes can be made inside a class without affecting other code.
Example: Student Class
Let’s build a simple Student class.
class Student {
constructor(name, age) {
this.name = name;
this.age = age;
}
printDetails() {
console.log("Name: " + this.name);
console.log("Age: " + this.age);
}
}
Creating Multiple Students
let student1 = new Student("Aman", 20);
let student2 = new Student("Priya", 21);
let student3 = new Student("Rahul", 19);
Calling Method
student1.printDetails();
student2.printDetails();
student3.printDetails();
Output
Name: Aman
Age: 20
Name: Priya
Age: 21
Name: Rahul
Age: 19
Visualizing Class → Object Relationship
CLASS (Blueprint)
Student
┌─────────────┐
│ name │
│ age │
│ printDetails│
└──────┬──────┘
│
┌─────────┼─────────┐
│ │ │
student1 student2 student3
(Aman) (Priya) (Rahul)
A single class creates many objects.
Assignment
Try this exercise to practice.
Task
Create a class called Student
Add properties:
name
age
Add a method:
printDetails()
Create three student objects
Print their details.
Expected Example
Name: Riya
Age: 20
Conclusion
Object-Oriented Programming helps developers write clean, reusable, and organized code. In JavaScript, classes make it easier to create objects and structure applications.
Key takeaways:
Class → Blueprint
Object → Instance of class
Constructor → Initializes properties
Methods → Functions inside class
Encapsulation → Data and functions grouped together
Once you understand these basics, you can move to advanced OOP concepts like inheritance and polymorphism.