Class Expressions in JavaScript

🔍 What Are Class Expressions?

A class expression is one way to define a class in JavaScript — by assigning it to a variable, optionally with a name. This is different from a class declaration and allows for more dynamic and flexible class definitions.

Note

💡 Just like function expressions, class expressions can be named or unnamed (anonymous).

📝 Syntax: Anonymous Class Expression

You can assign an unnamed (anonymous) class directly to a variable.

Anonymous Class Expression

const User = class {
  constructor(name) {
    this.name = name;
  }

  greet() {
    console.log(`Hello, ${this.name}!`);
  }
};

const u = new User("Alice");
u.greet(); // Hello, Alice!

📝 Syntax: Named Class Expression

You can also provide a name inside the class expression. That name is only accessible within the class body.

Named Class Expression

const Person = class NamedPerson {
  constructor(age) {
    this.age = age;
  }

  getLabel() {
    return NamedPerson.name;
  }
};

const p = new Person(30);
console.log(p.getLabel()); // NamedPerson
console.log(Person.name);  // NamedPerson

Note

⚠️ The class name in a named class expression is not accessible outside the class body.

🚀 When to Use Class Expressions

  • When you want to define a class inline inside a function or expression.
  • When you don’t need the class name outside the class body (anonymous).
  • When you want better encapsulation or assign different class variants dynamically.

📦 Example: Inline Use in IIFE

You can use a class expression inside an Immediately Invoked Function Expression (IIFE) or any scoped block.

Class in IIFE

const instance = new (class {
  constructor() {
    this.message = "Hello from IIFE class!";
  }
})();

console.log(instance.message); // Hello from IIFE class!

📚 Learn More

>>"JavaScript gives you more than one way to define things — class expressions are one such elegant tool for flexibility." 🛠️