JavaScript Static Properties and Methods


The keyword static describes a static method for a class. So, it’s likely to assign a method to the class function and not to its "prototype". Methods like this are generally known as static.

In a class, they start with the static keyword, as follows:

So, it’s the same as directly assigning it as a property:

The class constructor Car is the value of this in Car.staticMethod() call. It’s according to the “object before dot” rule.

As a rule, developers use static methods for implementing functions that belong to the class and not to any specific object of it.

For example, you have Book objects, and a function is required to compare them. Adding Book.compare method might be a natural solution. Here is an example:

In this example, Book.compare stands “above” articles, as a means of distinguishing them. It’s not an article method, but the method of the whole class.

Another solution is the so-called “factory” method. Let’s see that few ways are necessary for creating an article:

  • To create it by specific parameters (datetitle, and more).
  • To create an empty article, including today’s date.
  • Somehow in another way.

You can implement the first way by the constructor. For the second one, you are recommended to make a static method of the class.

Like Book.createBookToday() in the following example:

So, anytime you need to create the summary of today, you need to call Book.createBookToday().

Also, you have the option of using static methods in database-related classes for searching/saving/removing entities from the database, like here:

// assuming Book is a special class for managing articles
// static method to remove the article:
Book.remove({
  id: 123
});

Static Properties

Before starting to learn, note that this is a recent addition to the language, and its examples work in the latest Chrome.

Static properties look like ordinary class properties, but starting with static, like this:

So, it’s the same as a direct assignment to Book, like this:

Book.site = "W3Docs";

Inheritance of Static Properties and Methods

Static methods and properties are inherited.

Let’s take a look at here:

So, at the time, we call MyCar.compare, the inherited Car.compare is called. It works as demonstrated in the picture below:

So, MyCar extends Car generates two [[Prototype]] references. They are the following:

  • The MyCar function inherits from the Car function.
  • The MyCar.prototype inherits from the Car.prototype.

Consequently, inheritance operates for regular, as well as static methods.

Let’s check it:

Summary

In general, developers use static methods for the functionality that belongs to the whole class. That doesn’t relate to a specific class instance.

For instance, a method for comparison Book.compare(book1, book2) or a so-called factory method Book.createBookToday().

Static properties are applied when it’s necessary to store class-level data, not bound to an instance.

Static methods and properties are considered inherited.


Leave a Reply

Your email address will not be published. Required fields are marked *