Academy — Sanjib Sikder

The Problem Classes Solve

You know how to create one object. But what if you need a hundred students, each with the same shape — name, marks, subject, a method to compute grade?

Copy-pasting the object literal a hundred times is not an option. You need a blueprint — something you define once and stamp out as many times as you like.

JavaScript

Ctrl+Enter to run

// Without a class — manually building each object
const s1 = { name: "Rahul",  marks: 82, grade() { return this.marks >= 75 ? "A" : "B"; } };
const s2 = { name: "Priya",  marks: 91, grade() { return this.marks >= 75 ? "A" : "B"; } };
const s3 = { name: "Arjun",  marks: 49, grade() { return this.marks >= 75 ? "A" : "B"; } };

// grade() copied identically three times — fragile, doesn't scale
console.log(s1.name, s1.grade());
console.log(s2.name, s2.grade());
console.log(s3.name, s3.grade());

The grade method is identical in every object but duplicated everywhere. Change the grading rule and you must find and update every copy. A class solves this.

Your First Class

JavaScript

Ctrl+Enter to run

class Student {
  constructor(name, marks, subject) {
    this.name    = name;
    this.marks   = marks;
    this.subject = subject;
  }

grade() {
if (this.marks >= 90) return "A+";
if (this.marks >= 75) return "A";
if (this.marks >= 60) return "B";
return "C";
}

describe() {
return `${this.name} (${this.subject}): ${this.marks} — ${this.grade()}`;
}
}

const s1 = new Student("Rahul", 82, "Physics");
const s2 = new Student("Priya", 91, "Chemistry");
const s3 = new Student("Arjun", 49, "Maths");

console.log(s1.describe());
console.log(s2.describe());
console.log(s3.describe());

// All three share the same grade() method — defined once
console.log(s1.grade === s2.grade); // true

class defines the blueprint
constructor runs automatically when you write new Student(...) — it sets up the object's initial state
Methods defined inside the class are shared by all instances — there is only one copy of grade() in memory, regardless of how many students you create
new creates a fresh instance and returns it

Classes Are Syntactic Sugar

This is important to understand: JavaScript classes are not a fundamentally different system. They are a cleaner way of writing what the language was already doing with functions and prototypes.

JavaScript

Ctrl+Enter to run

// Class syntax
class Circle {
  constructor(r) { this.r = r; }
  area() { return Math.PI * this.r ** 2; }
}

// Exactly equivalent — old prototype syntax
function CircleOld(r) { this.r = r; }
CircleOld.prototype.area = function() { return Math.PI * this.r ** 2; };

const a = new Circle(5);
const b = new CircleOld(5);

console.log(a.area().toFixed(4));
console.log(b.area().toFixed(4)); // identical

// The class version is just easier to read and write

Classes didn't add new power to JavaScript — they added readable syntax over existing prototype-based mechanics. Knowing this means you are never mystified by what's actually happening underneath.

Inheritance — Extending a Class

One class can extend another, inheriting all its properties and methods and adding its own.

JavaScript

Ctrl+Enter to run

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

introduce() {
return `Hi, I'm ${this.name}, ${this.age} years old.`;
}
}

class Student extends Person {
constructor(name, age, marks) {
super(name, age); // call the parent constructor first
this.marks = marks;
}

// Add a new method
status() {
return this.marks >= 50 ? "passed" : "failed";
}

// Override the parent method
introduce() {
return `${super.introduce()} I scored ${this.marks}.`;
}
}

const p = new Person("Dr. Sikder", 50);
const s = new Student("Rahul", 17, 82);

console.log(p.introduce());
console.log(s.introduce()); // uses overridden version
console.log(s.status());

// Student has everything Person has, plus more
console.log(s instanceof Student); // true
console.log(s instanceof Person); // also true

super(...) calls the parent class's constructor. You must call it before accessing this in a child constructor. super.introduce() calls the parent's method — letting you extend behaviour rather than replace it entirely.

Static Methods — Belonging to the Class, Not the Instance

Sometimes a method makes sense on the class itself, not on individual objects. Use static:

JavaScript

Ctrl+Enter to run

class MathUtils {
  static square(n)     { return n * n; }
  static cube(n)       { return n * n * n; }
  static clamp(n, min, max) { return Math.max(min, Math.min(max, n)); }
  static average(...nums)   { return nums.reduce((a, b) => a + b, 0) / nums.length; }
}

// Called on the class itself — no 'new' needed
console.log(MathUtils.square(7));
console.log(MathUtils.cube(4));
console.log(MathUtils.clamp(150, 0, 100));
console.log(MathUtils.average(82, 91, 49, 78, 95).toFixed(1));

// Static methods don't exist on instances
const m = new MathUtils();
console.log(typeof m.square); // undefined

Static methods are utilities that conceptually belong to the class but don't need the state of any particular instance. Math.sqrt, Array.isArray, Object.keys — these are all static methods on built-in classes.

Private Fields — True Encapsulation

JavaScript now has real private fields using the # prefix. They are completely inaccessible from outside the class — not just by convention, but enforced by the language:

JavaScript

Ctrl+Enter to run

class BankAccount {
  #balance;      // private field — # prefix
  #owner;

constructor(owner, initialDeposit) {
this.#owner = owner;
this.#balance = initialDeposit;
}

deposit(amount) {
if (amount <= 0) throw new Error("Deposit must be positive");
this.#balance += amount;
return this; // enables chaining
}

withdraw(amount) {
if (amount > this.#balance) throw new Error("Insufficient funds");
this.#balance -= amount;
return this;
}

get balance() { return this.#balance; }

toString() {
return `${this.#owner}: ₹${this.#balance.toLocaleString()}`;
}
}

const account = new BankAccount("Rahul", 10000);
account.deposit(5000).deposit(2000).withdraw(3000); // chaining
console.log(account.toString());
console.log("Balance:", account.balance);

// Cannot access private fields from outside
try {
console.log(account["#balance"]); // undefined — not accessible
console.log(account.#balance); // syntax error
} catch (e) {
console.log("Access blocked:", e.message);
}

The get balance() syntax defines a getter — a method that looks like a property when you read it (account.balance, not account.balance()). Getters and setters let you control read/write access to private data.

A Complete Example — Putting It Together

JavaScript

Ctrl+Enter to run

class Exam {
  #students = [];

addStudent(name, marks) {
this.#students.push({ name, marks });
return this;
}

get count() { return this.#students.length; }
get average() {
if (!this.#students.length) return 0;
return this.#students.reduce((s, st) => s + st.marks, 0) / this.#students.length;
}
get topStudent() {
return this.#students.reduce((top, s) => s.marks > top.marks ? s : top);
}

report() {
const sorted = [...this.#students].sort((a, b) => b.marks - a.marks);
console.log(`=== Exam Report (n=${this.count}) ===`);
console.log(`Average: ${this.average.toFixed(1)}`);
console.log(`Top: ${this.topStudent.name} (${this.topStudent.marks})`);
console.log("Rankings:");
sorted.forEach(({ name, marks }, i) => {
const grade = marks >= 90 ? "A+" : marks >= 75 ? "A" : marks >= 60 ? "B" : "C";
console.log(` ${i + 1}. ${name}: ${marks} [${grade}]`);
});
}
}

const exam = new Exam();

exam
.addStudent("Rahul", 82)
.addStudent("Priya", 91)
.addStudent("Arjun", 49)
.addStudent("Sneha", 78)
.addStudent("Vikram", 95)
.addStudent("Meera", 63);

exam.report();

class Exam {
  #students = [];

addStudent(name, marks) {
this.#students.push({ name, marks });
return this;
}

get count() { return this.#students.length; }
get average() {
if (!this.#students.length) return 0;
return this.#students.reduce((s, st) => s + st.marks, 0) / this.#students.length;
}
get topStudent() {
return this.#students.reduce((top, s) => s.marks > top.marks ? s : top);
}

report() {
const sorted = [...this.#students].sort((a, b) => b.marks - a.marks);
console.log(`=== Exam Report (n=${this.count}) ===`);
console.log(`Average: ${this.average.toFixed(1)}`);
console.log(`Top: ${this.topStudent.name} (${this.topStudent.marks})`);
console.log("Rankings:");
sorted.forEach(({ name, marks }, i) => {
const grade = marks >= 90 ? "A+" : marks >= 75 ? "A" : marks >= 60 ? "B" : "C";
console.log(` ${i + 1}. ${name}: ${marks} [${grade}]`);
});
}
}

const exam = new Exam();

exam
.addStudent("Rahul", 82)
.addStudent("Priya", 91)
.addStudent("Arjun", 49)
.addStudent("Sneha", 78)
.addStudent("Vikram", 95)
.addStudent("Meera", 63);

exam.report();

Private #students array, public getters for derived values, method chaining via return this — this is what a well-designed class looks like in practice.

What You Have Learned

Classes are blueprints for creating many objects of the same shape — with shared methods, inheritance, and genuine encapsulation.

The key ideas:

class + constructor + new — define the blueprint, set up state, stamp out instances
Methods defined in a class are shared by all instances — one copy in memory, not one per object
Classes are syntactic sugar over JavaScript's prototype system — same mechanics, cleaner syntax
extends + super — inherit everything from a parent class, override what you need
static methods belong to the class itself, not to any instance
#privateField — truly private, enforced by the language, not just convention
Getters (get prop()) let you expose computed values as though they are plain properties

In the next lesson: Error Handling — try, catch, finally, custom error classes, and how to write code that fails gracefully rather than crashing silently or catastrophically.

Classes & Object-Oriented Programming

The Problem Classes Solve

Your First Class

Classes Are Syntactic Sugar

Inheritance — Extending a Class

Static Methods — Belonging to the Class, Not the Instance

Private Fields — True Encapsulation

A Complete Example — Putting It Together

What You Have Learned