Skip to main content
A named class expression is a class definition evaluated as an expression where the class is explicitly assigned an identifier. Unlike an anonymous class expression, this identifier creates a local binding strictly within the class’s own lexical scope, dictating how the class references itself internally and defining its internal [[Name]] record. 
const VariableBinding = class InternalIdentifier {
  // Class body
};

​
Technical Characteristics

Lexical Scoping of the Identifier The identifier assigned to the class (InternalIdentifier) is only bound within the class body. It is not added to the enclosing lexical environment. Attempting to reference the internal identifier outside of the class body will result in a ReferenceError. The name Property When a class expression is named, the JavaScript engine assigns the internal identifier to the class’s name property. The outer variable binding (VariableBinding) does not infer its name onto the class if the internal identifier is present. Immutability Classes are implicitly executed in strict mode. The internal binding created by the named class expression is immutable. Any attempt to reassign the internal identifier from within the class body will throw a TypeError. Evaluation and Hoisting Named class expressions are evaluated at runtime when the execution context reaches the expression. Unlike class declarations, they are not hoisted. The outer variable binding follows the hoisting rules of its declaration keyword (const, let, or var), but the class itself remains uninitialized until evaluation.

​
Behavior Visualization

const OuterRef = class InnerName {
  constructor() {
    // The internal identifier is accessible within the class body
    console.log(typeof InnerName); // "function"
  }

  static getClassName() {
    return InnerName.name;
  }
  
  static attemptReassignment() {
    // Throws TypeError: Assignment to constant variable.
    InnerName = "NewName"; 
  }
};

// The .name property reflects the internal identifier, not the variable binding
console.log(OuterRef.name); // "InnerName"

// The internal identifier is strictly local to the class body
try {
  console.log(InnerName);
} catch (error) {
  console.log(error.name); // "ReferenceError"
}
Tired of Poor JavaScript Skills? Fix That With Deep Grasping!Learn More