JavaScript Static Methods
Static methods are functions that are defined on a class but are not accessible through instances of the class. Instead, they are called directly on the class itself. These methods are useful for creating utility functions or shared logic that doesn’t depend on individual object instances.
Syntax
class ClassName {
static methodName() {
// method logic
}
}
class MathUtils {
static add(a, b) {
return a + b;
}
static multiply(a, b) {
return a * b;
}
}
// Calling static methods on the class
console.log(MathUtils.add(5, 3));
console.log(MathUtils.multiply(4, 6));
class MathUtils { static add(a, b) { return a + b; } static multiply(a, b) { return a * b; }}// Calling static methods on the classconsole.log(MathUtils.add(5, 3));console.log(MathUtils.multiply(4, 6));Output
8 24
In this example, the add and multiply methods can be called directly on the MathUtils class, without creating an instance.
Characteristics of Static Methods
- Class-Based: Static methods are invoked on the class itself, not on instances of the class.
- No Access to Instance Properties: Static methods do not have access to ‘this’ or instance-specific properties.
- Common Use Cases:
- Utility functions (e.g., mathematical operations, string manipulations).
- Factory methods for object creation.
- Shared logic that doesn’t depend on individual objects.
Use case of Static Methods
1. Static Method Math.max()
The getMax() method is a static method that wraps the built-in Math.max() function, demonstrating how static methods can be used to perform operations directly on the class.
class Calc {
static getMax(...numbers) {
return Math.max(...numbers);
}
}
console.log(Calc.getMax(1, 5, 3, 9));
class Calc { static getMax(numbers) { return Math.max(numbers); }}console.log(Calc.getMax(1, 5, 3, 9));Output
9
The getMax() method takes any number of arguments and returns the highest value using the Math.max() function.
2. Static Method Array.isArray()
Static methods like checkArray() allow you to check for specific conditions (e.g., checking if a variable is an array) without needing to instantiate the class.
class Validator {
static check(input) {
return Array.isArray(input);
}
}
console.log(Validator.check([1, 2, 3]));
console.log(Validator.check('hello'));
class Validator { static check(input) { return Array.isArray(input); }}console.log(Validator.check([1, 2, 3]));console.log(Validator.check('hello'));The checkArray() method uses the Array.isArray() method to determine if the input is an array.
3. Static Method Counter
Static methods can be used to manage class-level state, such as a counter, without creating individual instances.
class Count {
static c = 0;
static inc() {
return ++Count.c;
}
static reset() {
Count.c = 0;
}
}
console.log(Count.inc());
console.log(Count.inc());
Count.reset();
console.log(Count.inc());
class Count { static c = 0; static inc() { return ++Count.c; } static reset() { Count.c = 0; }}console.log(Count.inc()); console.log(Count.inc()); Count.reset();console.log(Count.inc());Output
1 2 1
The Count class has a static property c, which keeps track of the number of times the inc() method is called. The reset() method allows resetting the counter.
4. Static Method Factory Pattern
Static methods can serve as factory methods to create instances of a class, simplifying object creation and initialization.
class User {
constructor(name, age) {
this.name = name;
this.age = age;
}
static create(name, age) {
return new User(name, age);
}
}
const user = User.create('Ajay', 30);
console.log(user);
class User { constructor(name, age) { this.name = name; this.age = age; } static create(name, age) { return new User(name, age); }}const user = User.create('Ajay', 30);console.log(user);The createUser() static method is a factory method that returns a new instance of the User class.
5. Static Method Singleton Pattern
Static methods can be used to implement design patterns like the Singleton, where only one instance of the class is allowed.
class DB{
static instance
constructor()
{
if(DB.instance)
{
return DB.instance
}
DB.instance=this
}
static getinstance()
{
if(!DB.instance)
{
DB.instance=new DB()
}
return DB.instance
}
}
const obj1=new DB()
const obj2=new DB()
console.log(obj1===obj2)
class DB{ static instance constructor() { if(DB.instance) { return DB.instance } DB.instance=this } static getinstance() { if(!DB.instance) { DB.instance=new DB() } return DB.instance }}const obj1=new DB()const obj2=new DB()console.log(obj1===obj2)Output
true
In the DB class, the getInstance() method ensures that only one instance of the class is created. If an instance already exists, it returns the existing one. This is an implementation of the Singleton pattern, ensuring a single point of access to the class.
