100% Free Forever
AI-Powered Learning
Industry Expert Content
Certificates & Badges
Learn At Your Own Pace
JavaScript

Classes in JavaScript

How ES6 class syntax provides a cleaner, structured way to create objects and implement object-oriented patterns on top of JavaScript's prototype system.

OOP in JavaScriptIntermediate9 min readJul 8, 2026
Analogies

1. Introduction

A class in JavaScript is a template for creating objects that share the same properties and methods. Introduced in ES6 (2015), the class keyword gives object-oriented code a familiar, readable shape similar to languages like Java or Python, even though JavaScript remains a prototype-based language under the hood. Classes bundle state (fields) and behavior (methods) together, making it easier to model real-world entities such as users, shapes, or bank accounts.

🏏

Cricket analogy: A standard team-selection template, batting order slots, fielding positions, role requirements, lets any franchise stamp out a full squad quickly, bundling each player's stats, the state, and their on-field duties, the behavior, into one consistent format, even though the underlying player contracts work differently behind the scenes.

2. Syntax

javascript
class ClassName {
  // instance field (optional)
  field = initialValue;

  constructor(param1, param2) {
    this.param1 = param1;
    this.param2 = param2;
  }

  instanceMethod() {
    // regular method, shared via the prototype
  }

  static staticMethod() {
    // called on the class itself, not on instances
  }
}

const obj = new ClassName(value1, value2);

3. Explanation

ES6 class syntax is syntactic sugar over JavaScript's existing prototype-based inheritance model. When you write class Animal { ... }, the engine still creates a function object (Animal) with a prototype property, and instance methods declared inside the class body are placed on Animal.prototype, exactly as they would be with a manually written constructor function. typeof Animal is "function", and Animal.prototype.constructor === Animal is true.

🏏

Cricket analogy: Calling a bowler a specialist pacer is really just a label over the same underlying training system every bowler goes through; check the fine print and pacer still traces back to the base bowler certification, the same way Animal.prototype.constructor === Animal reveals the class is still a function underneath.

Methods defined inside a class are automatically non-enumerable and are added to the prototype, not to each instance, so all instances share one copy of each method in memory. static methods and fields belong to the class itself and are called as ClassName.method(), not instance.method() — they are commonly used for utility or factory functionality that does not depend on a particular instance.

🏏

Cricket analogy: Every player on a team shares the same rulebook, one copy of the how-to-appeal method on the prototype, rather than each player carrying a personal printed rulebook, while the national selection committee, a static method, belongs to the board itself, not to any individual player.

Class declarations are NOT hoisted the way function declarations are. A class exists in the 'temporal dead zone' (TDZ) from the start of the enclosing scope until its declaration is evaluated. Referencing a class before its declaration line throws a ReferenceError, even though the class name is technically hoisted (unlike var, which would just be undefined).

4. Example

javascript
class Animal {
  constructor(name, sound) {
    this.name = name;
    this.sound = sound;
  }

  makeSound() {
    console.log(`${this.name} says ${this.sound}`);
  }

  static describe() {
    console.log("Animals are living organisms.");
  }
}

const cat = new Animal("Cat", "Meow");
cat.makeSound();
Animal.describe();

console.log(typeof Animal);
console.log(Animal.prototype.constructor === Animal);

try {
  console.log(Wolf.name);
} catch (e) {
  console.log(e instanceof ReferenceError);
}

class Wolf extends Animal {}

5. Output

text
Cat says Meow
Animals are living organisms.
function
true
true

6. Key Takeaways

  • class is syntactic sugar over prototype-based inheritance — typeof MyClass is still "function".
  • Class declarations are in the temporal dead zone and are NOT hoisted like function declarations.
  • Instance methods live on ClassName.prototype and are shared across all instances, not copied per object.
  • static members belong to the class itself, not to instances created with new.
  • Referencing a class before its declaration throws a ReferenceError, unlike hoisted var which yields undefined.

Practice what you learned

Was this page helpful?

Topics covered

#JavaScript#JavaScriptProgrammingStudyNotes#Programming#ClassesInJavaScript#Classes#Syntax#Explanation#Example#OOP#StudyNotes#SkillVeris