¿Declarando constantes estáticas en las clases de ES6?

Quiero implementar constantes en un class , porque ahí es donde tiene sentido ubicarlas en el código.

Hasta ahora, he estado implementando la siguiente solución con métodos estáticos:

class MyClass {
    static constant1() { return 33; }
    static constant2() { return 2; }
    // ...
}

Sé que existe la posibilidad de jugar con los prototipos, pero muchos recomiendan no hacerlo.

¿Hay una mejor manera de implementar constantes en las clases de ES6?

Aquí hay algunas cosas que puedes hacer:

Exportar a constdesde el módulo . Dependiendo de su caso de uso, podría simplemente:

export const constant1 = 33;

E importe eso desde el módulo cuando sea necesario. O, basándose en su idea del método estático, puede declarar un static get accessor :

const constant1 = 33,
      constant2 = 2;
class Example {

  static get constant1() {
    return constant1;
  }

  static get constant2() {
    return constant2;
  }
}

De esa manera, no necesitará paréntesis:

const one = Example.constant1;

Ejemplo REPL de Babel

Luego, como usted dice, dado que a classes solo azúcar sintáctico para una función, puede agregar una propiedad no escribible de esta manera:

class Example {
}
Object.defineProperty(Example, 'constant1', {
    value: 33,
    writable : false,
    enumerable : true,
    configurable : false
});
Example.constant1; // 33
Example.constant1 = 15; // TypeError

Puede ser bueno si pudiéramos hacer algo como:

class Example {
    static const constant1 = 33;
}

Pero desafortunadamente, esta sintaxis de propiedad de clase solo está en una propuesta de ES7, e incluso entonces no permitirá agregarla consta la propiedad.

class Whatever {
    static get MyConst() { return 10; }
}

let a = Whatever.MyConst;

Parece funcionar para mi.

Estoy usando babely la siguiente sintaxis está funcionando para mí:

class MyClass {
    static constant1 = 33;
    static constant2 = {
       case1: 1,
       case2: 2,
    };
    // ...
}

MyClass.constant1 === 33
MyClass.constant2.case1 === 1

Tenga en cuenta que necesita el preajuste "stage-0".
Para instalarlo:

npm install --save-dev babel-preset-stage-0

// in .babelrc
{
    "presets": ["stage-0"]
}

Actualizar:

uso actual stage-3

En este documento dice:

No existe (intencionalmente) una forma declarativa directa de definir propiedades de datos de prototipo (que no sean métodos) propiedades de clase o propiedad de instancia

Esto significa que es intencionalmente así.

¿Quizás puedas definir una variable en el constructor?

constructor(){
    this.key = value
}

También es posible usar Object.freezeen su objeto de clase (es6) / función de constructor (es5) para hacerlo inmutable:

class MyConstants {}
MyConstants.staticValue = 3;
MyConstants.staticMethod = function() {
  return 4;
}
Object.freeze(MyConstants);
// after the freeze, any attempts of altering the MyConstants class will have no result
// (either trying to alter, add or delete a property)
MyConstants.staticValue === 3; // true
MyConstants.staticValue = 55; // will have no effect
MyConstants.staticValue === 3; // true

MyConstants.otherStaticValue = "other" // will have no effect
MyConstants.otherStaticValue === undefined // true

delete MyConstants.staticMethod // false
typeof(MyConstants.staticMethod) === "function" // true

Intentar alterar la clase te dará una falla suave (no arrojará ningún error, simplemente no tendrá ningún efecto).

¿Quizás solo ponga todas sus constantes en un objeto congelado?

class MyClass {

    constructor() {
        this.constants = Object.freeze({
            constant1: 33,
            constant2: 2,
        });
    }

    static get constant1() {
        return this.constants.constant1;
    }

    doThisAndThat() {
        //...
        let value = this.constants.constant2;
        //...
    }
}

Como dijo https://stackoverflow.com/users/2784136/rodrigo-botti , creo que estás buscando Object.freeze(). Aquí hay un ejemplo de una clase con estática inmutable:

class User {
  constructor(username, age) {
    if (age < User.minimumAge) {
      throw new Error('You are too young to be here!');
    }
    this.username = username;
    this.age = age;
    this.state = 'active';
  }
}

User.minimumAge = 16;
User.validStates = ['active', 'inactive', 'archived'];

deepFreeze(User);

function deepFreeze(value) {
  if (typeof value === 'object' && value !== null) {
    Object.freeze(value);
    Object.getOwnPropertyNames(value).forEach(property => {
      deepFreeze(value[property]);
    });
  }
  return value;
}

Aquí hay una manera más que puedes hacer

/*
one more way of declaring constants in a class,
Note - the constants have to be declared after the class is defined
*/
class Auto{
   //other methods
}
Auto.CONSTANT1 = "const1";
Auto.CONSTANT2 = "const2";

console.log(Auto.CONSTANT1)
console.log(Auto.CONSTANT2);

Nota: el orden es importante, no puede tener las constantes anteriores

Uso console.log (Auto.CONSTANT1);

Puede crear una forma de definir constantes estáticas en una clase utilizando una característica extraña de las clases ES6. Dado que las subclases heredan las estadísticas, puede hacer lo siguiente:

const withConsts = (map, BaseClass = Object) => {
  class ConstClass extends BaseClass { }
  Object.keys(map).forEach(key => {
    Object.defineProperty(ConstClass, key, {
      value: map[key],
      writable : false,
      enumerable : true,
      configurable : false
    });
  });
  return ConstClass;
};

class MyClass extends withConsts({ MY_CONST: 'this is defined' }) {
  foo() {
    console.log(MyClass.MY_CONST);
  }
}

Puede hacer que las "constantes" sean de solo lectura (inmutables) congelando la clase. p.ej

class Foo {
    static BAR = "bat"; //public static read-only
}

Object.freeze(Foo); 

/*
Uncaught TypeError: Cannot assign to read only property 'BAR' of function 'class Foo {
    static BAR = "bat"; //public static read-only
}'
*/
Foo.BAR = "wut";

Si se siente cómodo mezclando y haciendo coincidir la función y la sintaxis de clase, puede declarar constantes después de la clase (las constantes se 'levantan'). Tenga en cuenta que Visual Studio Code tendrá dificultades para formatear automáticamente la sintaxis mixta (aunque funciona).

class MyClass {
    // ...

}
MyClass.prototype.consts = { 
    constant1:  33,
    constant2: 32
};
mc = new MyClass();
console.log(mc.consts.constant2);    

Hice esto.

class Circle
{
    constuctor(radius)
    {
        this.radius = radius;
    }
    static get PI()
    {
        return 3.14159;
    }
}

El valor de PI está protegido contra cambios ya que es un valor que se devuelve desde una función. Puede acceder a través de Circle.PI. Cualquier intento de asignarlo simplemente se deja caer al suelo de una manera similar a un intento de asignar un carácter de cadena a través de [].

Puedes definirlo así:

class Foo {
  static MyConst = 200;

  myFunc() {
    const doubleConst = Foo.MyConst * 2;
  }
}

Podrías usar la import * assintaxis. Aunque no es una clase, son constvariables reales .

Constantes.js

export const factor = 3;
export const pi = 3.141592;

index.js

import * as Constants from 'Constants.js'
console.log( Constants.factor );