Skip to content Skip to sidebar Skip to footer

Es6 Classes - Updating Static Properties

I am trying to figure out alternative ways to set a static (or class) property an ES6 Class and then change it after new instances of the class are created. For example, lets say

Solution 1:

There's no such thing as static all = [] in ES6. Class instance and static fields are currently stage 3 proposals which can be used via a transpiler, e.g. Babel. There's already existing implementation in TypeScript that may be incompatible with these proposals in some way, yet static all = [] is valid in TS and ES.Next.

Geo.all = [];

is valid and preferable way to do this in ES6. The alternative is getter/setter pair - or only a getter for read-only property:

classGeo{
  static get all() {
    if (!this._all)
      this._all = [];

    returnthis._all;
  }

  constructor() { ... }
}

Tracking instances in static property can't generally be considered a good pattern and will lead to uncontrollable memory consumption and leaks (as it was mentioned in comments).

Solution 2:

This works for me for static properties.

classNeoGeo {

    constructor() {

    }

    staticgettopScore () {
      if (NeoGeo._topScore===undefined) {
        NeoGeo._topScore = 0; // set default here
      }

      return NeoGeo._topScore;
    }

    staticsettopScore (value) {
      NeoGeo._topScore = value;
    }

  }

And your example:

classNeoGeo {

    constructor() {
      NeoGeo.addInstance(this);
      console.log("instance count:" + NeoGeo.all.length);
    }

    staticgetall () {

      if (NeoGeo._all===undefined) {
        NeoGeo._all = [];
      }

      return NeoGeo._all;
    }

    staticsetall (value) {
      NeoGeo._all = value;
    }

    staticaddInstance(instance) {
      // add only if not already addedif (NeoGeo.all.indexOf(instance)==-1) {
        NeoGeo.all.push(instance);
      }
    }
  }

Note: In the getter you could also check for the existence of the property using the in keyword or the hasOwnProperty keyword.

staticgettopScore () {
      if (!("_topScore"in NeoGeo)) {
        NeoGeo._topScore = 0; // set default here
      }

      return NeoGeo._topScore;
    }

And using hasOwnProperty:

staticgettopScore () {
      if (NeoGeo.hasOwnProperty("_topScore")==false) {
        NeoGeo._topScore = 0; // set default here
      }

      return NeoGeo._topScore;
    }

Solution 3:

I recently had a similar issue of creating static classes.

I first tried it with constant class variables, but Chrome debugger threw an error. So I defined the class variables 'static', also the getter methods.

Worked in Chrome.

classTestClass {
  //static properties.static _prop1 = [ 'A', 'B', 'C'];
  static _prop2 = true;
  static _prop3 = 'some String';
  
  //constructor. Commented out because the class only has static elements.//constructor () {}//Getters.static get prop1 () {
    returnthis._prop1;
  }
  
  static get prop2 () {
    returnthis._prop2;
  }
  
  static get prop3 () {
    returnthis._prop3;
  }
}

Solution 4:

The only way to properly add a getter is to extend the class and use that extended class.

class Basic {
  get firstGetter() {
    return 'firstGetter'
  }
}
class ExtendedClass extends Basic {
  get firstGetter() {
    return 'updatedFirstGetter'
  }
}

}

Solution 5:

Update your node to the version 12 or up and that's it ;)

Post a Comment for "Es6 Classes - Updating Static Properties"