Declaring a Class in JavaScript
In JavaScript, you declare a class using the class keyword followed by the class name and a pair of curly braces. The class body can contain a constructor, instance methods, static methods, getter and setter methods, and field declarations. Classes introduced in ECMAScript 2015 (ES6) are syntactic sugar over JavaScript's existing prototype-based inheritance, so understanding what happens under the hood helps avoid common confusion about how objects are actually created and linked.
More from this site
Keep reading the latest coverage
Basic Class Declaration
A minimal class declaration defines a blueprint for creating objects. The following example shows a simple class with no constructor or methods:
- class Person {} — declares an empty class.
- new Person() — creates an instance, though a constructor is not strictly required for this to work.
Adding a constructor lets you initialize instance-specific state when a new object is created with new. The constructor method is called automatically during instantiation, and this refers to the newly created object.
Adding Methods and Properties
Inside a class body, you can declare instance methods directly. These are added to the prototype of the class and shared across all instances, which is more memory-efficient than defining the same function inside the constructor for every object.
- greet() — an instance method that can access this.name.
- this.name = name — sets an instance property in the constructor.
JavaScript also supports class fields, which allow you to declare properties directly in the class body outside the constructor. Field declarations are evaluated in the order they appear and are part of the public interface of the class unless prefixed with # for private fields.
Constructor Parameters and Initialization
The constructor accepts parameters so that each instance can be initialized with unique values. When you call new ClassName(arg1, arg2), those arguments are passed into the constructor function. Validation or default values can be handled inside the constructor before assigning properties.
| Syntax | Purpose |
|---|---|
| class Name {} | Declares a class with no constructor |
| constructor(x) { this.x = x } | Initializes instance with a parameter |
| static method() {} | Defines a method on the class itself, not instances |
| #privateField | Declares a truly private field accessible only inside the class |
Inheritance with extends
JavaScript classes support inheritance through the extends keyword. A subclass inherits all prototype methods from its parent and can override them or call the parent implementation using super(). Inside a subclass constructor, you must call super() before accessing this, because the parent constructor sets up the internal [[Prototype]] chain that makes this valid.
When a subclass does not define its own constructor, JavaScript implicitly inserts a default constructor that calls super(...args). This means simple subclasses can extend a parent class without explicitly writing a constructor at all.
Static Properties and Methods
Static members belong to the class itself rather than to any instance. You declare them using the static keyword. Static methods are useful for factory functions or utility operations that do not depend on instance state, and static properties can hold class-level configuration or counters.
- static className = 'Person' — a static property.
- static create() { return new this() } — a static factory method.
Private Fields with #
JavaScript classes now support true private fields using the # prefix. A private field is only accessible inside methods of the same class and is not visible or accessible from outside, even through the prototype chain. This is stronger than the convention of prefixing a property with an underscore, which is merely a signal and not enforced by the language.
- #balance — a private field only the class can read or modify.
- Attempting to access #balance outside the class throws a SyntaxError.
Classes Are Not Hoisted
Unlike function declarations, class declarations are not hoisted. You cannot reference a class before its declaration in the source code. If you need hoisting behavior, a class expression can be used, but it still does not allow use before the assignment executes.
Declaring a class in JavaScript is straightforward with the class keyword, but the real power comes from understanding how constructors, prototypes, inheritance, and private fields work together to create clean, reusable object blueprints.