Web/JavaScript/Reference/Classes/static

From Get docs


The static keyword defines a static method or property for a class. Neither static methods nor static properties can be called on instances of the class. Instead, they're called on the class itself. Static methods are often utility functions, such as functions to create or clone objects, whereas static properties are useful for caches, fixed-configuration, or any other data you don't need to be replicated across instances.


Syntax

static methodName() { ... }
static propertyName [= value];

Examples

Using static members in classes

The following example demonstrates several things:

  1. How a static member (method or property) is defined on a class.
  2. That a class with a static member can be sub-classed.
  3. How a static member can and cannot be called.
class Triple {
  static customName = 'Tripler';
  static description = 'I triple any number you provide';
  static triple(n = 1) {
    return n * 3;
  }
}

class BiggerTriple extends Triple {
  static longDescription;
  static description = 'I square the triple of any number you provide';
  static triple(n) {
    return super.triple(n) * super.triple(n);
  }
}

console.log(Triple.description);   // 'I triple any number you provide'
console.log(Triple.triple());      // 3
console.log(Triple.triple(6));     // 18

var tp = new Triple();

console.log(BiggerTriple.triple(3));        // 81 (not affected by parent's instantiation)
console.log(BiggerTriple.description);      // 'I square the triple of any number you provide'
console.log(BiggerTriple.longDescription);  // undefined
console.log(BiggerTriple.customName);       // 'Tripler'

console.log(tp.triple());         // 'tp.triple is not a function'.

Calling static members from another static method

In order to call a static method or property within another static method of the same class, you can use the this keyword.

class StaticMethodCall {
  static staticProperty = 'static property';
  static staticMethod() {
    return 'Static method and ' + this.staticProperty + ' has been called';
  }
  static anotherStaticMethod() {
    return this.staticMethod() + ' from another static method';
  }
}
StaticMethodCall.staticMethod(); 
// 'Static method and static property has been called'

StaticMethodCall.anotherStaticMethod(); 
// 'Static method and static property has been called from another static method'

Calling static members from a class constructor and other methods

Static members are not directly accessible using the this keyword from non-static methods. You need to call them using the class name: CLASSNAME.STATIC_METHOD_NAME() / CLASSNAME.STATIC_PROPERTY_NAME or by calling the method as a property of the constructor: this.constructor.STATIC_METHOD_NAME() / this.constructor.STATIC_PROPERTY_NAME

class StaticMethodCall {
  constructor() {
    console.log(StaticMethodCall.staticProperty); // 'static property'
    console.log(this.constructor.staticProperty); // 'static property' 
    console.log(StaticMethodCall.staticMethod()); // 'static method has been called.' 
    console.log(this.constructor.staticMethod()); // 'static method has been called.' 
  }
 
  static staticProperty = 'static property';
  static staticMethod() {
    return 'static method has been called.';
  }
}

Specifications

Specification
ECMAScript (ECMA-262)The definition of 'Class definitions' in that specification.

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile Server
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet Node.js
static

Chrome Full support 49


Full support 49


No support 42 — 49

Notes'

Notes' Strict mode is required. No support 42 — 49

Disabled'

Disabled' From version 42 until version 49 (exclusive): this feature is behind the Experimental JavaScript preference (needs to be set to Enabled). To change preferences in Chrome, visit chrome://flags.

Edge

Full support 13

Firefox

Full support 45

IE

No support No

Opera Full support 36


Full support 36


No support 29 — 36

Notes'

Notes' Strict mode is required. No support 29 — 36

Disabled'

Disabled' From version 29 until version 36 (exclusive): this feature is behind the Experimental JavaScript preference (needs to be set to Enabled).

Safari

Full support 9

WebView Android Full support 49


Full support 49


No support 42 — 49

Notes'

Notes' Strict mode is required.

Chrome Android Full support 49


Full support 49


No support 42 — 49

Notes'

Notes' Strict mode is required. No support 42 — 49

Disabled'

Disabled' From version 42 until version 49 (exclusive): this feature is behind the Experimental JavaScript preference (needs to be set to Enabled). To change preferences in Chrome, visit chrome://flags.

Firefox Android

Full support 45

Opera Android Full support 36


Full support 36


No support 29 — 36

Notes'

Notes' Strict mode is required. No support 29 — 36

Disabled'

Disabled' From version 29 until version 36 (exclusive): this feature is behind the Experimental JavaScript preference (needs to be set to Enabled).

Safari iOS

Full support 9

Samsung Internet Android Full support 5.0


Full support 5.0


No support 4.0 — 5.0

Notes'

Notes' Strict mode is required.

nodejs Full support 6.0.0


Full support 6.0.0


Full support 4.0.0

Disabled'

Disabled' From version 4.0.0: this feature is behind the --use_strict runtime flag. Full support 5.0.0

Disabled'

Disabled' From version 5.0.0: this feature is behind the --harmony runtime flag.

Legend

Full support  
Full support
No support  
No support
See implementation notes.'
See implementation notes.
User must explicitly enable this feature.'
User must explicitly enable this feature.


See also

static by Mozilla Contributors is licensed under CC-BY-SA 2.5.