Déclarer des constantes statiques dans les classes ES6?

Je veux implémenter des constantes dans a class, car c'est là qu'il est logique de les localiser dans le code.

Jusqu'à présent, j'ai implémenté la solution de contournement suivante avec des méthodes statiques:

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

Je sais qu'il est possible de jouer avec les prototypes, mais beaucoup le déconseillent.

Existe-t-il un meilleur moyen d'implémenter des constantes dans les classes ES6?

Voici quelques choses que vous pourriez faire:

Exportez un constdepuis le module . Selon votre cas d'utilisation, vous pouvez simplement:

export const constant1 = 33;

Et importez cela depuis le module si nécessaire. Ou, en vous appuyant sur votre idée de méthode statique, vous pouvez déclarer un static accesseur get :

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

  static get constant1() {
    return constant1;
  }

  static get constant2() {
    return constant2;
  }
}

De cette façon, vous n'aurez pas besoin de parenthèses:

const one = Example.constant1;

Exemple Babel REPL

Ensuite, comme vous le dites, comme a classn'est qu'un sucre syntaxique pour une fonction, vous pouvez simplement ajouter une propriété non inscriptible comme ceci:

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

Ce serait bien si nous pouvions faire quelque chose comme:

class Example {
    static const constant1 = 33;
}

Mais malheureusement, cette syntaxe de propriété de classe est uniquement dans une proposition ES7, et même alors, elle ne permettra pas d'ajouter constà la propriété.

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

let a = Whatever.MyConst;

Semble fonctionner pour moi.

J'utilise babelet la syntaxe suivante fonctionne pour moi:

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

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

Veuillez considérer que vous avez besoin du préréglage "stage-0".
Pour l'installer:

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

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

Mettre à jour:

utiliser actuellement stage-3

Dans ce document, il indique:

Il n'y a (intentionnellement) aucun moyen déclaratif direct de définir les propriétés de classe des propriétés de données du prototype (autres que les méthodes) ou la propriété d'instance

Cela signifie que c'est intentionnellement comme ça.

Peut-être pouvez-vous définir une variable dans le constructeur?

constructor(){
    this.key = value
}

Il est également possible d'utiliser Object.freezesur votre objet classe (es6) / fonction constructeur (es5) pour le rendre immuable:

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

Essayer de modifier la classe vous donnera un soft-fail (ne lancera aucune erreur, cela n'aura tout simplement aucun effet).

Peut-être juste mettre toutes vos constantes dans un objet figé?

class MyClass {

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

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

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

Comme https://stackoverflow.com/users/2784136/rodrigo-botti a dit, je pense que vous cherchez Object.freeze(). Voici un exemple de classe avec une statique immuable:

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

Voici une autre façon de faire

/*
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);

Remarque - L'ordre est important, vous ne pouvez pas avoir les constantes ci-dessus

Utilisation console.log (Auto.CONSTANT1);

Vous pouvez créer un moyen de définir des constantes statiques sur une classe en utilisant une caractéristique étrange des classes ES6. Étant donné que les statiques sont héritées par leurs sous-classes, vous pouvez effectuer les opérations suivantes:

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

Vous pouvez rendre les "constantes" en lecture seule (immuables) en gelant la classe. par exemple

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 vous êtes à l'aise pour mélanger et faire correspondre la fonction et la syntaxe de classe, vous pouvez déclarer des constantes après la classe (les constantes sont «levées»). Notez que Visual Studio Code aura du mal à formater automatiquement la syntaxe mixte (bien que cela fonctionne).

class MyClass {
    // ...

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

J'ai fait ça.

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

La valeur de PI est protégée contre toute modification car il s'agit d'une valeur renvoyée par une fonction. Vous pouvez y accéder via Circle.PI. Toute tentative de l'assigner est simplement abandonnée sur le sol d'une manière similaire à une tentative d'assigner à un caractère de chaîne via [].

Vous pouvez le définir comme ceci:

class Foo {
  static MyConst = 200;

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

Vous pouvez utiliser la import * assyntaxe. Bien qu'il ne s'agisse pas d'une classe, ce sont de vraies constvariables.

Constants.js

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

index.js

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