Static Properties in JavaScript
📌 What Are Static Properties?
In JavaScript, static properties are properties that belong to the class itself — not to instances created from the class. They’re useful for storing data or configurations shared across all instances, like counters, constants, or settings.
Note
💡 Just like static methods, static properties are accessed directly on the class, not its instances.
🧱 Declaring Static Properties
Static properties can be declared using the static keyword inside the class body.
Static Property Syntax
class Counter {
static count = 0;
constructor() {
Counter.count++;
}
}
new Counter();
new Counter();
console.log(Counter.count); // 2Note
🧠 In this example, count is a static property that tracks how many instances have been created.
🔍 Accessing Static Properties
You access static properties directly on the class name:
Accessing Static Properties
console.log(Counter.count); // ✅ Correct
console.log(new Counter().count); // ❌ Undefined (doesn't exist on instance)Note
⚠️ Attempting to access a static property on an instance will return undefined.
🧬 Static Properties in Inheritance
Static properties are inherited by subclasses and can also be overridden.
Inheritance Example
class Animal {
static type = "Mammal";
}
class Dog extends Animal {}
console.log(Dog.type); // "Mammal"🎯 Use Cases for Static Properties
- Storing constants like PI, max size, or API base URLs
- Tracking instance creation or statistics
- Global configuration shared across all instances
📊 Table: Instance vs Static Property
| Aspect | Instance Property | Static Property |
|---|---|---|
| Declared | Inside constructor or method | With static keyword in class body |
| Accessed via | Instance (e.g. obj.name) | Class (e.g. ClassName.name) |
| Inherited | Yes | Yes |
📚 Further Reading
>>“Static properties live on the class — not on its children.”