As applications grow larger, managing code becomes more difficult. Developers need a way to organize code so it becomes reusable, structured, and easier to maintain.
One approach that helps solve this problem is Object-Oriented Programming (OOP).
JavaScript supports Object-Oriented Programming, allowing developers to model real-world concepts directly in code.
In this blog, we will explore the basics of OOP in JavaScript and understand how classes and objects work.
Topics Covered
In this article we will learn:
- What Object-Oriented Programming (OOP) means
- A real-world analogy (blueprint → objects)
- What a class is in JavaScript
- Creating objects using classes
- The constructor method
- Methods inside a class
- A basic idea of encapsulation
What is Object-Oriented Programming?
Object-Oriented Programming (OOP) is a programming paradigm based on the idea of objects.
Instead of writing programs only as sequences of instructions, OOP organizes code around objects that contain both data and behavior.
Each object can contain:
- Properties → data about the object
- Methods → actions the object can perform
This approach makes code:
- More modular
- Easier to reuse
- Easier to maintain
Real-World Analogy: Blueprint → Objects
A helpful way to understand OOP is by thinking about blueprints and real objects.
Imagine a car factory.
- The blueprint defines how a car should look and behave.
- Each car created from that blueprint is an actual object.
Example:
Blueprint → Car design
Objects → Individual cars produced from that design
In programming:
- Class → Blueprint
- Object → Instance created from the blueprint
What is a Class in JavaScript?
A class is a template used to create objects.
It defines:
- What properties an object will have
- What methods it can perform
Example of a simple class:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
Here:
-
Personis the class -
nameandageare properties defined inside the constructor
Creating Objects Using Classes
Objects are created from classes using the new keyword.
Example:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
const person1 = new Person("Alice", 25);
const person2 = new Person("Bob", 30);
console.log(person1.name);
console.log(person2.age);
Output:
Alice
30
Here:
-
person1andperson2are objects (instances) of thePersonclass.
The Constructor Method
The constructor is a special method inside a class.
It runs automatically when a new object is created.
Its main purpose is to initialize object properties.
Example:
class Car {
constructor(brand, model) {
this.brand = brand;
this.model = model;
}
}
const car1 = new Car("Toyota", "Corolla");
Here the constructor assigns values to the properties brand and model.
Methods Inside a Class
Classes can also contain methods. Methods are functions that belong to the class.
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("Alice", 25);
person1.greet();
Output:
Hello, my name is Alice
Here, greet() is a method that belongs to the Person class.
Basic Idea of Encapsulation
Encapsulation is the concept of bundling data and methods together inside a class.
This helps protect data and organize code better.
Instead of modifying data directly everywhere in the program, we manage it through the class.
Example:
class Student {
constructor(name, age) {
this.name = name;
this.age = age;
}
getDetails() {
console.log(this.name + " is " + this.age + " years old.");
}
}
const student1 = new Student("Rahul", 20);
student1.getDetails();
Here the data (name, age) and behavior (getDetails) are grouped together.
Assignment Example
Let’s create a Student class and use it to create multiple student objects.
class Student {
constructor(name, age) {
this.name = name;
this.age = age;
}
printDetails() {
console.log("Student Name: " + this.name);
console.log("Age: " + this.age);
}
}
const student1 = new Student("Kunal", 21);
const student2 = new Student("Ananya", 20);
student1.printDetails();
student2.printDetails();
Output:
Student Name: Kunal
Age: 21
Student Name: Ananya
Age: 20
This shows how one class can be used to create multiple objects easily.
Visualizing Class and Objects
You can imagine the relationship like this:
Class (Blueprint)
↓
Student
↓
Objects (Instances)
student1 → { name: "Kunal", age: 21 }
student2 → { name: "Ananya", age: 20 }
One class can generate many objects.
Why OOP is Useful
Object-Oriented Programming helps developers:
- Reuse code using classes
- Organize large programs better
- Represent real-world entities in code
- Make applications easier to maintain
This is why OOP is widely used in modern JavaScript applications.
Final Thoughts
Object-Oriented Programming is a powerful way to structure JavaScript code.
In this article we learned:
- What OOP means
- How classes work
- How to create objects using classes
- How constructors initialize data
- How methods define behavior
- The basic idea of encapsulation
Once you understand these fundamentals, you can move on to more advanced concepts like inheritance and polymorphism.
Top comments (0)