在 TypeScript 中将值与枚举进行比较并不明显答案

【问题标题】：Comparing value to enum isn't obvious in TypeScript在 TypeScript 中将值与枚举进行比较并不明显
【发布时间】：2017-08-18 02:41:54
【问题描述】：

我有非常简单的代码：

enum Color { BLUE, RED }

class Brush { 
    color: Color

    constructor(values) { 
        this.color = values.color
    }
}

let JSON_RESPONSE = `{"color": "BLUE"}`

let brush = new Brush(JSON.parse(JSON_RESPONSE))

现在我要进行检查：

console.log(brush.color === Color.BLUE)

它返回false。

我尝试了一些组合，例如

brush.color === Color[Color.BLUE]

但是，当然，编译器出错了。

问题是如何进行相当基本的比较enum === enum？

【问题讨论】：

标签： javascript json angular typescript enums

【解决方案1】：

另一种选择（available since TS 2.4）是String enums：

enum Color {
  BLUE = "BLUE",
  RED = "RED"
}

console.log('BLUE' === Color.BLUE); // true

由于字符串枚举没有反向映射（至少在 2020 年），人们可能会强烈考虑使用 const 修饰符内联那些枚举。

【讨论】：

【解决方案2】：

问题在于 TypeScript enums 实际上是“命名数字常量”。

来自the TypeScript documentation on enums：

枚举允许我们定义一组命名的数字常量。

枚举的主体由零个或多个枚举成员组成。枚举成员具有与其关联的数值 (sic)。 . .

您应该改用string literal types：

type Color = "BLUE" | "RED";

完整代码（View Demo）：

type Color = "BLUE" | "RED";

class Brush { 
    color: Color

    constructor(values) { 
        this.color = values.color
    }
}

let JSON_RESPONSE = `{"color": "BLUE"}`

let brush = new Brush(JSON.parse(JSON_RESPONSE))

console.log(brush.color === "BLUE"); //=> true

【讨论】：