In JavaScript, static methods are those that are declared within a class using the static keyword. These methods have a distinct nature compared to regular methods in JavaScript.
In JavaScript, it is not possible to invoke a static method through any of the created instances of the class. Instead, one must utilize the name of the class itself to call the static method, as it is inherently associated with the class.
JavaScript offers a static method that is associated with the class rather than with any specific instance of that class. Consequently, there is no need for an instance to invoke the static method. Such methods can be called directly on the class itself.
In straightforward terms, static methods belong to the class itself rather than to instances of the class.
Syntax:
Let’s examine the syntax for defining a static method in JavaScript, which can be expressed as follows:
class chat {
sendMessage(){
return "Arigato Gozaimasu (Thank you)"
}
}
Points to remember
- The static keyword is used to declare a static method.
- The static method can be of any name.
- A class can contain more than one static method.
- If we declare more than one static method with a similar name, the JavaScript always invokes the last one.
- The static method can be used to create utility functions.
- We can use this keyword to call a static method within another static method.
- We cannot use this keyword directly to call a static method within the non-static method. In such case, we can call the static method either using the class name or as the property of the constructor.
Why do we use static methods in JavaScript?
There are several advantages to utilizing static methods in JavaScript. Some of these reasons include:
Organization
In JavaScript, static methods serve the purpose of structuring code by linking a function directly to the class itself, instead of to specific instances of objects. Utilizing static methods enhances the readability and comprehensibility of the code.
Efficiency
In JavaScript, static methods are not associated with a specific instance of a class. We can invoke these static methods without needing to instantiate an object beforehand. Utilizing static methods enhances the efficiency and speed of the code.
Reusability
In JavaScript, static methods can be utilized multiple times across the program without requiring the instantiation of a class object each time. These static methods enhance code reusability and help eliminate code duplication.
Simplification
In certain circumstances, it is advantageous to use a function that operates independently of any object. JavaScript addresses these situations through the use of static methods. The reason for this is that static methods do not require an object context and can be called directly on the class itself.
How do static methods work in JavaScript?
Let’s explore how static methods function in JavaScript:
Definition
In JavaScript, a static method is established within a class by placing the static keyword in front of the method's name.
Scope
In JavaScript, static methods are linked to the class rather than to its instances. This implies that these methods can be invoked directly through the class itself, eliminating the necessity for an instance of the class or an object.
Usage
In JavaScript, static methods are invoked directly on the class rather than on an instance of the class. To call these methods, one can utilize the class name in conjunction with the method name.
Purpose
In JavaScript, static methods are frequently utilized for utility functions or processes that pertain to the class in its entirety rather than to specific instances.
Access
In JavaScript, when you are within a static method, the keyword this points to the class itself rather than to any specific instance. As a result, it is not possible to directly access properties or methods associated with an instance from within a static method.
Inheritance
In JavaScript, it is possible for subclasses to inherit static methods from their parent classes, and if necessary, we have the option to override these static methods.
Example 1
class square{
constructor(side){
this.side = side;
}
findPerimeter() {
return 4*this.side;
}
static comparePerimeter(squarea,squareb) {
if (squarea.side > squareb.side) {
console.log("first square has more perimeter");
}
else if(squarea.side < squareb.side){
console.log("second square has more perimeter");
}
else{
console.log("both have equal perimeter")
}
}
}
let squarea = new square(4);
let squareb = new square(4);
square.comparePerimeter (squarea,squareb);
Output:
Example 2
class user {
static heymail = "jtp123@gmail.com";
static checkValidMail (email){
console.log("Email is valid!");
}
static loginheymail(){
this.checkValidMail(this.heymail);
}
}
user.loginheymail()
Output:
Example 3
class Person {
constructor(name, email) {
this.name = name;
this.email = email;
}
print() {
console.log(this.name, this.email);
}
static create(str) {
let person = JSON.parse(str);
return new Person(person.name, person.email);
}
}
let str = '{"name": "Rohit", "email": "rohitjtp1@gmail.com"}';
let p1 = Person.create(str);
console.log(p1);
Output: