web-dev-qa-db-fra.com

Javascript ES6 - Énumérations dans des classes utilisées à l'extérieur comme une énumération statique

J'aimerais demander s'il est possible d'ajouter une énumération semblable à:

STATES = {
    WIP: "Work in progress",
    ONLINE: "Online",
    ONLINE_MODIFIED: "Online, modified",
    HIDDEN: "Hidden"
}

dans une classe et pouvoir l'utiliser dans un autre fichier avec quelque chose de similaire à: object.updateState(Class.STATES.HIDDEN) sans avoir à construire un nouvel objet tel que boxObject.updateState(new Box().STATES.HIDDEN)

Je vous remercie.

javascriptclassenumsecmascript-6es6-class
8
Maxime M.

comme ça :

export class Foo{}
Foo.SomeStaticEnum={BAR:"bar"};

mais exporter un const semble plus approprié ...

export const FOO={BAR:"bar"};
7
n00dl3

Vous pouvez obtenir des propriétés de données statiques de plusieurs manières:

Utiliser l'affectation:

const STATES = {
  WIP: "Work in progress",
  ONLINE: "Online",
  ONLINE_MODIFIED: "Online, modified",
  HIDDEN: "Hidden"
};

class Box {};

Box.STATES = STATES;
console.log(Box.STATES.WIP); // Work in progress is the output

Utilisez Object.defineProperty:

Lorsque vous utilisez Object.defineProperty vous pouvez le rendre en lecture seule

const STATES = {
  WIP: "Work in progress",
  ONLINE: "Online",
  ONLINE_MODIFIED: "Online, modified",
  HIDDEN: "Hidden"
};

class Box {};

Object.defineProperty(Box, 'STATES', {
  value: STATES,
  writable: false, // makes the property read-only
});

console.log(Box.STATES.WIP); // Work in progress is the output

Utiliser un getter statique:

Vous pouvez utiliser la syntaxe de getter statique ES6 pour ajouter la propriété dans la définition de classe. Vous pouvez le rendre en lecture seule en définissant uniquement le getter.

const STATES = {
  WIP: "Work in progress",
  ONLINE: "Online",
  ONLINE_MODIFIED: "Online, modified",
  HIDDEN: "Hidden"
};

class Box {
  static get STATES() {
    return STATES;
  }
}

console.log(Box.STATES.WIP); // Work in progress is the output

Cela étant dit, je suis d’accord avec n00dl3 . Si vous utilisez des modules ES6, utiliser une exportation nommée semble plus approprié:

export const BOX_STATES = {
  WIP: "Work in progress",
  ONLINE: "Online",
  ONLINE_MODIFIED: "Online, modified",
  HIDDEN: "Hidden"
};

export default class Box {};

Donc, vous pouvez l'importer comme ceci:

import { BOX_STATES } from './path-to-box';

console.log(BOX_STATES.WIP); // Work in progress is the output
16
pablogq

Une autre façon simple de faire cela sans avoir besoin de cours

const BOX_STATES = {
  WIP: "Work in progress",
  ONLINE: "Online",
  ONLINE_MODIFIED: "Online, modified",
  HIDDEN: "Hidden"
};

module.exports = BOX_STATES;

console.log(BOX_STATES.WIP);

Assurez-vous d'importer ou d'exiger votre fichier, comme indiqué ci-dessus.

0
Mohamed Salem Lamiri