Declarando constantes estáticas nas classes ES6?

Eu quero implementar constantes em a class, porque é aí que faz sentido localizá-las no código.

Até agora, tenho implementado a seguinte solução alternativa com métodos estáticos:

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

Eu sei que há uma possibilidade de mexer com protótipos, mas muitos recomendam isso.

Existe uma maneira melhor de implementar constantes nas classes ES6?

Aqui estão algumas coisas que você pode fazer:

Exporte um constdo módulo . Dependendo do seu caso de uso, você pode apenas:

export const constant1 = 33;

E importe isso do módulo sempre que necessário. Ou, desenvolvendo sua ideia de método estático, você pode declarar um static acessador get :

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

  static get constant1() {
    return constant1;
  }

  static get constant2() {
    return constant2;
  }
}

Dessa forma, você não precisará de parênteses:

const one = Example.constant1;

Exemplo de Babel REPL

Então, como você diz, como a classé apenas um açúcar sintático para uma função, você pode adicionar uma propriedade não gravável da seguinte forma:

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

Pode ser bom se pudéssemos fazer algo como:

class Example {
    static const constant1 = 33;
}

Infelizmente, porém, essa sintaxe de propriedade de classe está apenas em uma proposta do ES7 e, mesmo assim, não permitirá a adição constà propriedade.

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

let a = Whatever.MyConst;

Parece funcionar para mim.

Estou usando babele a seguinte sintaxe está funcionando para mim:

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

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

Por favor, considere que você precisa da predefinição "stage-0".
Para instalá-lo:

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

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

Atualizar:

atualmente usa stage-3

No presente documento ele afirma:

Não há (intencionalmente) nenhuma maneira declarativa direta de definir propriedades de classe de protótipo de dados (exceto métodos) ou propriedade de instância

Isso significa que é intencionalmente assim.

Talvez você possa definir uma variável no construtor?

constructor(){
    this.key = value
}

Também é possível usar Object.freezeem seu objeto de classe (es6) / função construtora (es5) para torná-lo imutável:

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

Tentar alterar a classe resultará em uma falha leve (não causará erros, simplesmente não terá efeito).

Talvez apenas coloque todas as suas constantes em um 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 https://stackoverflow.com/users/2784136/rodrigo-botti disse, acho que você está procurando Object.freeze(). Aqui está um exemplo de uma classe com estática imutável:

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;
}

Aqui está mais uma maneira de você fazer

/*
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 - a ordem é importante, você não pode ter as constantes acima

Uso console.log (Auto.CONSTANT1);

Você pode criar uma maneira de definir constantes estáticas em uma classe usando um recurso estranho das classes ES6. Como as estáticas são herdadas por suas subclasses, você pode fazer o seguinte:

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);
  }
}

Você pode tornar as "constantes" somente leitura (imutáveis) congelando a classe. por exemplo

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";

Se você se sente à vontade para misturar e combinar sintaxe de função e classe, pode declarar constantes após a classe (as constantes são 'levantadas'). Observe que o Visual Studio Code terá dificuldade para formatar automaticamente a sintaxe mista (embora funcione).

class MyClass {
    // ...

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

Eu fiz isso.

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

O valor do PI está protegido contra alterações, pois é um valor retornado de uma função. Você pode acessá-lo via Circle.PI. Qualquer tentativa de atribuir a ele é simplesmente descartada no chão de maneira semelhante a uma tentativa de atribuir a um caractere de string via [].

Você pode defini-lo assim:

class Foo {
  static MyConst = 200;

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

Você pode usar import * assintaxe. Embora não sejam uma classe, são constvariáveis reais .

Constants.js

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

index.js

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