【问题标题】:String enums in typescript打字稿中的字符串枚举
【发布时间】:2017-06-08 18:59:47
【问题描述】:

我想在 typescript 中有一组字符串枚举,这样我就可以做一些事情,比如让用户从一组预定义的选项中进行选择。

我在这个答案中找到了一个很好的解决方案:How to convert string to enum in TypeScript?

但是,这仅适用于单个单词...(基本上,上面允许您获取枚举名称值 - 并且其中不能有空格)。

所以,进一步看,我发现这个人有一个解决方法:Workaround for string based enums in typescript

这将允许这样的事情:

export enum EventType {
    Photoshoot = <any>"Photoshoot",
    BookingMeeting = <any>"Booking Meeting",
    PostShootMeeting = <any>"Post Shoot Meeting",
    Purchase = <any>"Purchase",
    Print = <any>"Print"
}

唯一的回应基本上是说这样做是不安全的。 (但我应该说,它确实有效——我可以输入 EventType.dot ...并且 Atom 编辑器为我提供了 5 个驼峰式选项可供选择(保持代码中的内容一致)我然后可以使用它来吐出字符串值,为我的用户提供良好的充满空间的体验,将来我可以更改枚举和不同的语言/选项措辞,而不会弄乱“代码”等等。 .

有没有更好的方法来做到这一点?我宁愿不要“不安全”地这样做——但我不知道还有其他方法。

【问题讨论】:

标签: javascript typescript enums


【解决方案1】:

TypeScript 枚举是基于数字的。您可以使用带有联合类型的字符串文字来模拟基于字符串的枚举,如下面的 CardinalDirection 示例所示。

type CardinalDirection =
    "North"
    | "East"
    | "South"
    | "West";

function move(distance: number, direction: CardinalDirection) {
    // ...
}

move(1,"North"); // Okay
move(1,"Nurth"); // Error!

这里还有更多: https://basarat.gitbooks.io/typescript/content/docs/types/literal-types.html

字符串枚举即将推出 https://github.com/Microsoft/TypeScript/issues/3192

【讨论】:

  • 这如何让我“为我的开发人员提供不会导致将字符串硬编码到业务逻辑代码中的特定选项”?在 OP 解决方案中,可以将字符串“Photoshoot”更改为“Photo shoot”,而无需进行任何其他编码更改(因为所有业务逻辑代码都引用了EventType.Photoshoot。似乎在此解决方案中,您需要找到每个如果您想将其更改为“nerf”,请在业务代码中使用“North”。也许我遗漏了一些东西,但是......?(很高兴字符串枚举正在讨论以供将来的打字稿使用)
  • @lowcrawler 如果要将“North”更改为“nerf”,只需转到代码中定义type CardinalDirection 的位置并将“North”更改为“nerf”。现在编译器会在每次使用“North”时给出一个错误,因为这里需要 CardinalDirection,所以你可以很容易地找到它们。
  • @thday 是我的错误,正如你指出的那样,你会得到一个编译器错误。
【解决方案2】:

您还有其他选择,如Reverse-Mapping for String Enums 中所述。

这是一个例子:

type EventType = "Photoshoot" | "Booking Meeting" | "Post Shoot Meeting" | "Purchase" | "Print";
const EventType {
    get Photoshoot(): EventType { return "Photoshoot"; },
    get BookingMeeting(): EventType { return "Booking Meeting"; },
    get PostShootMeeting(): EventType { return "Post Shoot Meeting"; },
    get Purchase(): EventType { return "Purchase"; },
    get Print(): EventType { return "Print"; }
}

【讨论】:

    【解决方案3】:

    TS 2.4 更新 - 2017+

    String EnumsTypeScript 2.4 开始可用,语法如下:

    enum Color {
        Red = "red",
        Green = "green",
        Blue = "blue"
    }
    

    Demo in TS Playground

    进一步阅读

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2018-10-23
      • 1970-01-01
      • 2020-07-11
      • 2021-04-19
      • 2020-04-30
      • 1970-01-01
      • 2019-10-30
      相关资源
      最近更新 更多