Static methods in JavaScript are special methods that belong to the class only, not to the objects that are made using that class. Earlier with classes, prototypes, and inheritance, we created methods that are used by the objects created from those classes. Here, I am focusing on methods that you cannot call using an object. Only the class can access them directly. If you want a quick refresher on how prototypes work, see
prototypes and the prototype chain.
What are JavaScript Static Methods
A static method is a function that belongs to the class itself, not to any object created from it. You cannot call it using an object. Only the class can access it directly. That is the core idea behind a static method.
JavaScript Static Methods Syntax
Create a method inside a class the usual way. To make it static, write the `static` keyword before the method name. That converts a normal method into a static method that is available on the class.
If you want to confirm types while experimenting with parameters like `marks`, you can quickly check with the
typeof operator examples.
Example: Student class with an instance method and a static method
Constructor and an instance method
class Student {
constructor(name, marks) {
this.name = name;
this.marks = marks;
}
show() {
return `${this.name} scored ${this.marks}`;
}
}
This class has a constructor that takes `name` and `marks` and stores them on `this`. The `show` method is a normal instance method. Objects created from `Student` can call `show`.
Add a static method
class Student {
constructor(name, marks) {
this.name = name;
this.marks = marks;
}
show() {
return `${this.name} scored ${this.marks}`;
}
static getGrade(marks) {
if (marks >= 90) {
return 'A';
}
return 'B';
}
}
I wrote a static method `getGrade`. It takes `marks` and returns a grade. This method belongs to the class itself.
Read More: Mastering setInterval timers in JavaScript
Create an object and call methods
const s1 = new Student('Ria', 78);
console.log(s1.show()); // "Ria scored 78"
Calling the instance method works because `show` is defined on the instance side of the class.
Call the static method on the class
// This will throw because static methods are not on the instance:
// console.log(s1.getGrade(77)); // TypeError: s1.getGrade is not a function
// Correct: call the static method on the class
console.log(Student.getGrade(78)); // "B"
The call `s1.getGrade(77)` fails because I made `getGrade` static. It belongs to the class, not the object. When I call `Student.getGrade(78)`, it works and returns “B”.
Key points for JavaScript Static Methods
- A static method is a function that belongs to the class itself.
- You cannot call a static method using an object.
- Call static methods directly with the class name, for example `Student.getGrade(78)`.
Static methods are for methods that you want to be available on the class itself. It will work only when you use it with the class, not with the object that is created using that particular class.
For related class and object behavior, revisit how prototype methods are shared via the chain here:
prototypes and the prototype chain.
Final Thoughts
A static method in JavaScript belongs to the class, not the instance. You cannot call it using an object. Only the class can access it directly. That is the concept behind a static method, and the example shows how a normal method like `show` is available on objects, while a static method like `getGrade` is available only on the class. If you want to play with types while testing your functions, check examples of the
typeof operator.
