Skip to main content

Command Palette

Search for a command to run...

Object-Oriented Architecture in JavaScript: A Technical Overview

Updated
3 min read

As projects grow larger, writing organized, reusable, and maintainable code becomes extremely important.

One programming paradigm that helps achieve this is Object-Oriented Programming (OOP).

What is Object-Oriented Programming (OOP)?

Object-Oriented Programming is a programming paradigm where we organize code using objects and classes instead of writing everything as separate functions and variables.

An object represents a real-world entity and contains:

  • Properties (data) → characteristics of the object

  • Methods (functions) → behaviors of the object

For example, consider a Car.

A car has:

Properties:

  • color

  • brand

  • speed

Methods:

  • start()

  • stop()

  • accelerate()

Instead of writing random variables and functions, OOP groups related data and behavior together.

What is a Class ?

A class is a template used to create objects.

It defines:

  • properties (data)

  • methods (actions)

Example: Creating a Class

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

  greet() {
    console.log("Hello, my name is " + this.name)
  }
}

Here:

  • Person → class

  • name and age → properties

  • greet() → method

Creating Objects from a Class

Objects are created using the new keyword.

const person1 = new Person("Rahul", 25)
const person2 = new Person("Anita", 30)

Now we have two objects created from the same class.

We can call their methods:

person1.greet()
person2.greet()

Output:

Hello, my name is Rahul
Hello, my name is Anita

This demonstrates code reusability — one class can create many objects.

Understanding the Constructor Method

The constructor is a special method that runs automatically when an object is created.

It is used to initialize object properties.

Example:

constructor(name, age) {
  this.name = name
  this.age = age
}

When we run:

new Person("Rahul", 25)

The constructor assigns:

this.name = "Rahul"
this.age = 25

Classes Under the Hood

The class syntax in JavaScript might look like a completely new way of creating objects, but under the hood it isn’t actually new.

JavaScript originally used constructor functions and prototype-based inheritance to implement Object-Oriented Programming. When the class keyword was introduced in ES6 (2015), it didn’t replace this system. Instead, it simply provided a cleaner and more readable syntax on top of the existing mechanism.

This is why JavaScript classes are often described as “syntactic sugar.” The syntax makes the code easier for developers to read and write, but internally JavaScript still relies on the same prototype system that has existed since the beginning.

In practice, this means that when we define a class in JavaScript, the engine still treats it similarly to a special type of function, and the methods we define inside the class are placed on the object's prototype.

So while classes make Object-Oriented code more structured and easier to understand, the underlying behaviour of JavaScript objects remains the same.

JavaScript Fundamentals for Developers

Part 14 of 22

Learn JavaScript from the ground up with clear explanations and practical examples. This series covers core JavaScript concepts like variables, arrays, functions, loops, objects, and modern ES6 features to help you build a strong foundation in JavaScript.

Up next

Understanding Objects in JavaScript

Imagine we are storing information about a student. Using separate variables for studentName, studentAge, and studentCourse is messy. Using an array ["John", 20, "CS"] is confusing because we have to