Object-Oriented Programming in JavaScript: Classes and Objects

As your JavaScript programs grow, keeping track of related data and functions becomes harder. You end up with scattered variables and disconnected logic that's difficult to manage. Object-Oriented Programming — OOP for short — gives you a structured way to organize your code around real-world concepts.

In this article, we'll cover what OOP is, how classes work in JavaScript, and how to start writing cleaner, more reusable code.

What Is Object-Oriented Programming?

OOP is a way of writing code where you model real-world things as objects. Each object has its own data (properties) and behaviors (methods) bundled together.

Instead of writing a bunch of loose variables and functions, you group everything related to a concept into one unit.

There are four core ideas in OOP, but we'll focus on the most important one for beginners: encapsulation — keeping related data and behavior together in one place.

The Blueprint Analogy

Think of a car factory. Before any car is built, the factory works from a blueprint. The blueprint defines what every car will have — an engine, four wheels, a color, a model name — and what every car can do — start, stop, accelerate.

The blueprint itself is not a car. It's just the plan. But from that one blueprint, you can manufacture hundreds of individual cars. Each car is its own object, with its own specific color and model, but all built from the same design.

Blueprint (Class)
      |
      |--- Car 1: color = "red",  model = "Sedan"
      |--- Car 2: color = "blue", model = "SUV"
      |--- Car 3: color = "black", model = "Coupe"

In JavaScript:

• The blueprint is a class

• Each individual car is an object (also called an instance)

What Is a Class in JavaScript?

A class is a template for creating objects. You define it once, then use it to create as many objects as you need — each with their own data but the same structure and behavior.

class Car {
  // everything that defines a Car goes here
}

That's the basic syntax. The class keyword, a name (capitalized by convention), and a pair of curly braces.

The Constructor Method

The constructor is a special method inside a class that runs automatically every time you create a new object from that class. It's where you set up the initial properties of the object.

class Car {
  constructor(model, color) {
    this.model = model;
    this.color = color;
  }
}

this here refers to the specific object being created. When you make a new car, this.model becomes that car's model, and this.color becomes that car's color.

Creating Objects from a Class

To create an object from a class, use the new keyword followed by the class name and any arguments the constructor expects.

const car1 = new Car("Sedan", "red");
const car2 = new Car("SUV", "blue");

console.log(car1.model); // "Sedan"
console.log(car2.color); // "blue"

Each object is independent. Changing car1 doesn't affect car2. They're built from the same blueprint but are separate instances.

Class: Car
  |
  |--- car1: { model: "Sedan", color: "red" }
  |--- car2: { model: "SUV",   color: "blue" }
  |--- car3: { model: "Coupe", color: "black" }

Adding Methods to a Class

A method is a function that belongs to a class. You define it inside the class body, and every object created from that class gets access to it.

class Car {
  constructor(model, color) {
    this.model = model;
    this.color = color;
  }

  describe() {
    console.log("This is a " + this.color + " " + this.model + ".");
  }

  start() {
    console.log(this.model + " engine started.");
  }
}

const car1 = new Car("Sedan", "red");
const car2 = new Car("SUV", "blue");

car1.describe(); // "This is a red Sedan."
car2.start();    // "SUV engine started."

You define the method once in the class. All objects share it, but this ensures each object uses its own data when the method runs.

A Closer Look: The Person Class

Let's try another example with a Person class to reinforce the concept.

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

  greet() {
    console.log("Hi, I'm " + this.name + " and I'm " + this.age + " years old.");
  }

  isAdult() {
    return this.age >= 18;
  }
}

const person1 = new Person("Alice", 25);
const person2 = new Person("Tom", 16);

person1.greet();              // "Hi, I'm Alice and I'm 25 years old."
console.log(person1.isAdult()); // true

person2.greet();              // "Hi, I'm Tom and I'm 16 years old."
console.log(person2.isAdult()); // false

One class, two very different objects — both with their own name and age, both using the same methods.

Encapsulation: Keeping Things Together

Encapsulation means bundling related data and behavior into one unit — the class. Instead of having a name variable here and a greet function somewhere else, everything about a Person lives in one place.

Without encapsulation:

// Scattered, hard to manage
let name = "Alice";
let age  = 25;

function greet(name, age) {
  console.log("Hi, I'm " + name + " and I'm " + age + " years old.");
}

With encapsulation:

// Organized, reusable, clear
class Person {
  constructor(name, age) {
    this.name = name;
    this.age  = age;
  }

  greet() {
    console.log("Hi, I'm " + this.name + " and I'm " + this.age + " years old.");
  }
}

As your codebase grows, this difference becomes enormous. Classes keep your code modular and easy to reason about.

Practice Assignment

Work through these steps to build your first class from scratch:

1. Create a class called Student with a constructor:

class Student {
  constructor(name, age, grade) {
    this.name  = name;
    this.age   = age;
    this.grade = grade;
  }
}

2. Add a method that prints the student's details:

class Student {
  constructor(name, age, grade) {
    this.name  = name;
    this.age   = age;
    this.grade = grade;
  }

  introduce() {
    console.log(
      "Name: " + this.name +
      ", Age: " + this.age +
      ", Grade: " + this.grade
    );
  }
}

3. Create multiple student objects and call the method:

const s1 = new Student("Raj", 20, "A");
const s2 = new Student("Priya", 22, "B");
const s3 = new Student("Arjun", 19, "A+");

s1.introduce(); // "Name: Raj, Age: 20, Grade: A"
s2.introduce(); // "Name: Priya, Age: 22, Grade: B"
s3.introduce(); // "Name: Arjun, Age: 19, Grade: A+"

Bonus: Add an isPassing() method that returns true if the grade is not "F".

Quick Recap

• OOP organizes code around objects that model real-world things

• A class is a blueprint — a template for creating objects

• The constructor method sets up an object's initial properties using this

• Methods are functions inside a class that all instances can use

• Encapsulation means keeping related data and behavior bundled together

• Use new ClassName() to create an object (instance) from a class

Classes are one of the most powerful tools in JavaScript. Once you're comfortable with the basics here, you'll be ready to explore inheritance, where one class can extend the behavior of another.

Happy coding! 🚀

If you enjoyed this article, check out my other blogs on this profile. 🔗 Connect with me: LinkedIn | GitHub | X (Twitter)