Static Properties and Functions in JavaScript

In an ES6 class, the static keyword lets you define a function on the class itself, as opposed to instances of the class.

class MyClass { static myFunction() { return 42 ; } } typeof MyClass.myFunction; MyClass.myFunction(); const obj = new MyClass(); obj.myFunction;

In JavaScript, a class is an object like any other. So statics let you define functions on the class within the class definition. Equivalently, you can just assign a function to MyClass :

class MyClass {} MyClass.myFunction = function ( ) { return 42 ; }; MyClass.myFunction();

With this

Within static functions, this refers to the class.

class MyClass { static myFunction() { return this ; } } MyClass.myFunction() === MyClass;

Static Properties

Static properties, also known as class fields, are currently a Stage 3 TC39 proposal, which means they are technically not part of the JavaScript language yet. However, they are supported in more recent versions of Google Chrome.

class MyClass { static answer = 42 ; } MyClass.answer;

Be careful when using static properties with non-primitive values. If you use inheritance with non-primitive static properties, each class that inherits from your class will have the same copy of the object.

class MyClass { static val = new Object (); } class MyChildClass extends MyClass {} MyChildClass.val === MyClass.val;

More Fundamentals Tutorials