Enums en Javascript avec ES6
je suis en train de reconstruire un vieux projet Java en Javascript, et j'ai réalisé qu'il n'y avait pas de bonne façon de faire des enums en JS.
Le mieux que je puisse vous arriver, c'est:
const Colors = {
RED: Symbol("red"),
BLUE: Symbol("blue"),
GREEN: Symbol("green")
};
Object.freeze(Colors);
le const empêche Colors d'être réassigné, et le gel empêche la mutation des clés et des valeurs. J'utilise des symboles pour que Colors.RED ne soit pas égal à 0 , ou quoi que ce soit d'autre.
est-il un le problème avec cette formulation? Est-il un meilleur moyen?
(je sais que cette question est un peu répétitive, mais toutes les questions précédentes sont assez anciennes, et ES6 nous donne de nouvelles capacités.)
modifier:
une autre solution, qui traite du problème de sérialisation, mais je crois a encore des problèmes de Royaume:
const enumValue = (name) => Object.freeze({toString: () => name});
const Colors = Object.freeze({
RED: enumValue("Colors.RED"),
BLUE: enumValue("Colors.BLUE"),
GREEN: enumValue("Colors.GREEN")
});
en utilisant les références d'objet comme valeurs, vous obtenez le même évitement de collision que les symboles.
8 réponses
y a-t-il un problème avec cette formulation?
Je n'en vois pas.
y a-t-il un meilleur moyen?
Je réduirais les deux déclarations en une seule:
const Colors = Object.freeze({
RED: Symbol("red"),
BLUE: Symbol("blue"),
GREEN: Symbol("green")
});
si vous n'aimez pas le boilerplate, comme les appels répétés Symbol , vous pouvez bien sûr aussi écrire une fonction helper makeEnum qui crée la même chose à partir d'une liste de nom.
vérifier aussi énumérer , une bibliothèque très bonne et bien décrite pour ES6 enums.
J'espère que cela aidera quelqu'un.
meilleures salutations,
Emmanuel
comme mentionné ci-dessus, vous pouvez aussi écrire un makeEnum() fonction d'aide:
function makeEnum(arr){
let obj = {};
for (let val of arr){
obj[val] = Symbol(val);
}
return Object.freeze(obj);
}
utilisez - le comme ceci:
const Colors = makeEnum(["red","green","blue"]);
let startColor = Colors.red;
console.log(startColor); // Symbol(red)
if(startColor == Colors.red){
console.log("Do red things");
}else{
console.log("Do non-red things");
}
Vérifier comment Tapuscrit t-il . Fondamentalement, ils font ce qui suit:
const MAP = {};
MAP[MAP[1] = 'A'] = 1;
MAP[MAP[2] = 'B'] = 2;
MAP['A'] // 1
MAP[1] // A
utilisez les symboles, bloquez l'objet, tout ce que vous voulez.
si vous n'avez pas besoin de pur ES6 et pouvez utiliser le typographie, il a une belle enum :
vous pouvez également utiliser le paquet es6-enum ( https://www.npmjs.com/package/es6-enum ). Il est très facile à utiliser. Voir l'exemple ci-dessous
vous pouvez utiliser la carte ES6
const colors = new Map([
['RED', 'red'],
['BLUE', 'blue'],
['GREEN', 'green']
]);
console.log(colors.get('RED'));
C'est mon approche personnelle.
class ColorType {
static get RED () {
return "red";
}
static get GREEN () {
return "green";
}
static get BLUE () {
return "blue";
}
}
// Use case.
const color = Color.create(ColorType.RED);