在javascript中创建枚举

Question

我想在 javascript 中创建枚举，我做了以下代码，我想验证这是正确的方法。

    var dataStates = {
    withMock: "withM",
    withoutMock: "withoutM",
};

还好吗？

例如，我想像这样使用它

oCation.dataMode === dataStates.withMock

那个 state.data.withMock 将保存该值，但我不确定这是否是正确的方式......

Answer 1

您创建的是具有命名属性的对象。这不是 Java 意义上的枚举。也就是说，没有强制唯一性和单一实例的语言限制。但是，您所做的将满足您在问题中指定的要求。

Answer 2

Javascript 没有正确的（静态）enum 类型，但您可以使用 Typescript 为其枚举生成的相同代码实现非常接近的目标。

要提供枚举但仍然是有效的 JS，您需要一个对象，其中每个枚举元素（名称）都是一个键，映射到一个唯一值（通常是一个 int，因为大多数具有枚举的语言都以整数值支持它们）。

对于像enum Color {Red, Green, Blue}; 这样的枚举，您最终会得到包含以下内容的代码：

Color[Color["Red"] = 0] = "Red";
Color[Color["Green"] = 1] = "Green";
Color[Color["Blue"] = 2] = "Blue";

这将创建一个对象，其中每个枚举元素的名称和每个元素的值都有一个键。最终对象如下所示：

var Color;

(function(Color) {
  Color[Color["Red"] = 0] = "Red";
  Color[Color["Green"] = 1] = "Green";
  Color[Color["Blue"] = 2] = "Blue";
})(Color || (Color = {}));

document.getElementById("result").textContent = JSON.stringify(Color);

<pre id="result"></pre>

这允许您使用传统的 Color.Red 语法访问枚举值，但也允许您使用 Color[Color.Red]（或包含枚举值之一的变量）将值映射回名称。

例如：

var Color;

(function(Color) {
  Color[Color["Red"] = 0] = "Red";
  Color[Color["Green"] = 1] = "Green";
  Color[Color["Blue"] = 2] = "Blue";
})(Color || (Color = {}));

document.getElementById("red").textContent = Color.Red; // Should print "0"

var currentColor = Color.Green;
document.getElementById("green").textContent = Color[currentColor]; // Should print "Green"

currentColor = Color.Blue;
document.getElementById("blue").textContent = Color[currentColor]; // Should now print "Blue"

<pre id="red"></pre>
<pre id="green"></pre>
<pre id="blue"></pre>