In this section, we will learn what the Static is and how it works in JavaScript.
Note: we’re assuming you’re already familiar with the JavaScript class as well as methods in classes.
What is Static in JavaScript?
There will be times when you want to define a class member that will be used independently of any object of that class. Normally, a class member must be accessed only in conjunction with an object of its class. However, it is possible to create a member (property or method) that can be used by itself, without reference to a specific instance.
To create such a member, precede its declaration with the keyword static.
When a member is declared static, it can be accessed via the name of that class without referencing to any object.
Also inside static members, `this` refers to the class itself. All other conventions are identical to prototype members.
To invoke a static member (property or method) of a class, we use the name of that class.
JavaScript Static Method
As mentioned before, a static method is a method in a class that proceeds with the keyword static.
Such a method is accessible only via the name of the class itself.
JavaScript Static Method Syntax:
static methodName(){ //body… }
Example: using static method in JavaScript
class Person{ constructor (firstName, lastName){ this.firstName = firstName; this.lastName = lastName; } static className(){ return this; } } console.log(Person.className());
Output:
class Person{ constructor (firstName, lastName){ this.firstName = firstName; this.lastName = lastName; } static className(){ return this; }
In this example, the static member of the `Person` class is:
static className(){ return this; }
As the output shows, the `this` keyword in a static method refers to the class itself.
JavaScript Static Variable (Property)
Just like the static methods, a static property in a class is a property that proceeds with the keyword static.
Such property is only accessible with the name of the class itself.
Static Property Syntax:
static propertyName;
Example: using static variable in JavaScript
class Person{ constructor (){ this.firstName = "John"; this.lastName = "Doe"; } static number = 0; static sayHello(){ return "Hello"; } } console.log(Person.sayHello()); console.log(Person.number++); console.log(Person.number++); console.log(Person.number++); console.log(Person.number++);
Output:
Hello 0 1 2 3