Understanding Object-Oriented Programming in JavaScript

As programs grow larger, organizing code becomes more important. Instead of writing scattered variables and functions, developers often use a structured approach called Object-Oriented Programming (OOP).
OOP helps us organize code around objects that represent real-world things. This makes programs easier to understand, maintain, and reuse.
JavaScript supports object-oriented programming, and learning the basics of it will help you build more structured applications.
What Object-Oriented Programming (OOP) Means
Object-Oriented Programming is a programming style where we structure code using objects and classes.
Instead of thinking about a program as a list of instructions, we think about it as a collection of objects that interact with each other.
For example:
A user object in a web app
A product object in an e-commerce site
A car object in a driving simulation
Each object contains:
Properties (data)
Methods (functions that operate on the data)
This approach makes it easier to organize and reuse code.
A Real-World Analogy: Blueprint and Objects
A good way to understand OOP is by thinking about blueprints.
Imagine a blueprint for a car. The blueprint describes things like:
color
engine type
speed
ability to start or stop
But the blueprint itself is not the actual car.
Using the blueprint, manufacturers can create many cars.
In programming:
Class → blueprint
Object → actual product created from the blueprint
For example, one blueprint can produce many cars:
Car 1 → Red Toyota
Car 2 → Black BMW
Car 3 → Blue Tesla
All of them follow the same structure.
What is a Class in JavaScript?
A class is a template used to create objects.
It defines what properties and methods an object should have.
Example of a simple class:
class Car {
constructor(brand, color) {
this.brand = brand;
this.color = color;
}
}
This class describes what a Car object should contain.
Creating Objects Using Classes
Once a class is defined, we can create objects from it.
This is done using the new keyword.
Example:
const car1 = new Car("Toyota", "Red");
const car2 = new Car("BMW", "Black");
Now we have two objects:
car1car2
Both were created using the same class blueprint.
The Constructor Method
The constructor is a special method inside a class.
It runs automatically when a new object is created.
It is used to initialize the object's properties.
Example:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
When we create a new object:
const person1 = new Person("Alice", 25);
JavaScript automatically assigns:
this.name = "Alice"
this.age = 25
So the object becomes:
{
name: "Alice",
age: 25
}
Methods Inside a Class
Classes can also contain methods.
Methods 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);
}
}
Creating and using the object:
const person1 = new Person("Alice", 25);
person1.greet();
Output:
Hello, my name is Alice
The method greet() is attached to the object.
Basic Idea of Encapsulation
Encapsulation simply means grouping related data and behavior together.
Instead of writing variables and functions separately, we place them inside a class.
Example:
A Student object might contain:
name
age
course
method to display details
All of these are bundled together.
Encapsulation helps keep code organized and prevents unrelated parts of the program from interfering with each other.
Why OOP is Useful
Object-oriented programming provides several advantages.
Code Reusability
You can create many objects from a single class.
Example:
Student1
Student2
Student3
All created from the same Student class.
Better Organization
Data and behavior stay grouped together.
Easier Maintenance
If you update the class, every object benefits from the change.
Assignment
Let’s build a small program using a class.
Step 1: Create a Student Class
class Student {
constructor(name, age) {
this.name = name;
this.age = age;
}
printDetails() {
console.log("Name: " + this.name);
console.log("Age: " + this.age);
}
}
Step 2: Create Multiple Student Objects
const student1 = new Student("John", 20);
const student2 = new Student("Emma", 22);
const student3 = new Student("David", 19);
Step 3: Call the Method
student1.printDetails();
student2.printDetails();
student3.printDetails();
Complete Assignment Solution
class Student {
constructor(name, age) {
this.name = name;
this.age = age;
}
printDetails() {
console.log("Name: " + this.name);
console.log("Age: " + this.age);
}
}
const student1 = new Student("John", 20);
const student2 = new Student("Emma", 22);
const student3 = new Student("David", 19);
student1.printDetails();
student2.printDetails();
student3.printDetails();
Example Output:
Name: John
Age: 20
Name: Emma
Age: 22
Name: David
Age: 19
Final Thoughts
Object-Oriented Programming is a powerful way to structure applications. By using classes and objects, developers can create reusable and organized code that closely models real-world systems.
Concepts like classes, constructors, and methods form the foundation of OOP in JavaScript. Once you understand these basics, it becomes much easier to build larger programs and explore more advanced topics such as inheritance and design patterns.
For now, focus on practicing classes and creating objects. The more examples you build, the more natural this programming style will feel.






