JavaScript Class Fields
Class fields declare properties directly in a class body and initialize them on each instance. They can store data or functions as own properties, independently of the class prototype.
A class field is a property declared in the class body, such as `name = "Ada"`. For an ordinary instance field, JavaScript creates an own property on each new instance, so two instances have separate storage for that field.
Fields can contain values or expressions, and instance fields are initialized as part of instance creation. A field whose value is a function, such as `greet = () => {}`, creates a separate function property for each instance rather than putting the function on the prototype.
This differs from methods declared with `greet() {}`. A class method is stored on the class prototype and is normally shared by instances, while an instance field containing a function is an own property of each instance.
Class fields can also be declared `static`, in which case the property belongs to the class constructor rather than individual instances. Public fields are directly accessible through normal property access; private fields use `#` and have different access and encapsulation rules.
Key points
- Instance fields become own properties of each instance.
- A field containing a function creates an instance-specific function property.
- Class methods are placed on the prototype and are normally shared.
- `static` fields belong to the class rather than its instances.
- Public fields can be accessed with ordinary property syntax.
Interview questions
Where does a JavaScript instance class field live?
An instance class field becomes an own property of the object being constructed. It is not stored on the class prototype. Each instance therefore has its own property storage for that field, even when the initial value is the same.
What is the difference between an instance field containing a function and a class method?
A function-valued instance field is assigned as an own property on each instance, so each instance gets its own function value. A class method is defined on the prototype and is normally shared by instances through prototype lookup. This distinction can affect memory usage, identity checks, and how prototype-based tooling sees the function.
What does `static` change for a class field?
A `static` field belongs to the class constructor rather than instances created from it. You access it through the class name, such as `Counter.limit`, rather than through an instance. Instances do not receive that field as their own property.
Why might you use a class field with an arrow function instead of a prototype method?
An arrow-function field creates a function per instance and captures the instance's lexical `this`. This can be convenient when passing a callback without manually binding the method. The tradeoff is that the function is not shared through the prototype, which can increase per-instance memory use and changes function identity semantics.