首页 文章

如何在TypeScript中将字符串转换为枚举?

提问于
浏览
159

我在TypeScript中定义了以下枚举?

enum Color{
    Red, Green
}

现在在我的函数中,我收到颜色作为字符串 . 我试过以下代码:

var green= "Green";
var color : Color = <Color>green; // Error: can't convert string to enum

如何将该值转换为枚举?

8 回答

  • 23

    TypeScript 0.9中的枚举是基于字符串编号的 . 对于简单的转换,您不应该需要类型断言:

    enum Color{
        Red, Green
    }
    
    // To String
     var green: string = Color[Color.Green];
    
    // To Enum / number
    var color : Color = Color[green];
    

    Try it online

    我在OSS书中有关于此和其他Enum模式的文档:https://basarat.gitbooks.io/typescript/content/docs/enums.html

  • 56

    从Typescript 2.1开始,枚举中的字符串键是强类型的 . keyof typeof 用于获取有关可用字符串键的信息(1):

    enum Color{
        Red, Green
    }
    
    let typedColor: Color = Color.Green;
    let typedColorString: keyof typeof Color = "Green";
    
    // Error "Black is not assignable ..." (indexing using Color["Black"] will return undefined runtime)
    typedColorString = "Black";
    
    // Error "Type 'string' is not assignable ..." (indexing works runtime)
    let letColorString = "Red";
    typedColorString = letColorString;
    
    // Works fine
    typedColorString = "Red";
    
    // Works fine
    const constColorString = "Red";
    typedColorString = constColorString
    
    // Works fine (thanks @SergeyT)
    let letColorString = "Red";
    typedColorString = letColorString as keyof typeof Color;
    
    typedColor = Color[typedColorString];
    

    https://www.typescriptlang.org/docs/handbook/advanced-types.html#index-types

  • 16

    本说明涉及basarat的answer,而不是原始问题 .

    我在我自己的项目中遇到了一个奇怪的问题,即编译器使用相当于此代码的错误大致相当于“无法将字符串转换为颜色”:

    var colorId = myOtherObject.colorId; // value "Green";
    var color: Color = <Color>Color[colorId]; // TSC error here: Cannot convert string to Color.
    

    我发现编译器类型推理变得混乱,它认为 colorId 是枚举值而不是ID . 要解决这个问题,我必须将ID转换为字符串:

    var colorId = <string>myOtherObject.colorId; // Force string value here
    var color: Color = Color[colorId]; // Fixes lookup here.
    

    我不确定是什么导致了这个问题,但我会在这里留下这个说明以防万一我遇到同样的问题 .

  • 15

    使用以下代码使其工作 .

    var green= "Green";
    var color : Color= <Color>Color[green];
    
  • 250

    如果您确定输入字符串与Color enum完全匹配,则使用:

    const color: Color = (<any>Color)["Red"];
    

    在输入字符串可能与Enum不匹配的情况下使用:

    const mayBeColor: Color | undefined = (<any>Color)["WrongInput"];
    if(mayBeColor !== undefined){
         //TSC will understand that mayBeColor of type Color here
    }
    

    Playground


    如果我们不将 enum 转换为 <any> 类型,则tsc将显示错误

    Element隐式具有'any'类型,因为索引表达式不是'number'类型 .

    这意味着默认情况下TS Enum类型使用数字索引,即 let c = Color[0] ,但不使用 let c = Color["string"] 等字符串索引 . 这是Microsoft团队对更常见问题Object string indexes的已知限制 .

  • 8

    我也遇到了相同的编译器错误 . 只是Sly_cardinal方法的略微变化 .

    var color: Color = Color[<string>colorId];
    
  • 0

    如果typescript编译器知道变量的类型是字符串而不是这个

    let colorName : string = "Green";
    let color : Color = Color[colorName];
    

    否则你应该显式地将其转换为字符串(以避免编译器警告)

    let colorName : any = "Green";
    let color : Color = Color["" + colorName];
    

    在运行时,两种解决方案都可以

  • 7

    's a lot of mixed info in this question, so let'涵盖 Nick's Guide to Using Enums in Models with Typescript 中的Typescript 2.x的整个实现 .

    本指南适用于:创建客户端代码的人员,这些代码从服务器中提取一组已知的字符串,这些字符串在客户端方便地建模为Enum .

    定义枚举

    让我们从枚举开始,它应该看起来像这样:

    export enum IssueType {
      REPS = 'REPS',
      FETCH = 'FETCH',
      ACTION = 'ACTION',
      UNKNOWN = 'UNKNOWN',
    }
    

    这里有两点需要注意:

    • 我们明确地将这些声明为字符串支持的枚举案例,它允许我们用字符串实例化它们,而不是其他一些不相关的数字 .

    • 我们在服务器型号上添加了一个可能存在或不存在的选项: UNKNOWN . 如果您愿意,可以将其作为 undefined 进行处理,但我希望尽可能避免类型上的 | undefined 来简化处理 .

    有一个 UNKNOWN 案例的好处在于,你可以在代码中真正明白它,并为未知枚举案件制作明亮的红色和眨眼的样式,这样你就知道你没有正确处理它 .

    解析枚举

    您可能正在使用嵌入在另一个模型中的此枚举,或者仅使用此枚举,但您将不得不将来自JSON或XML(ha)的string-y类型枚举解析为强类型对应项 . 嵌入到另一个模型中时,此解析器位于类构造函数中 .

    parseIssueType(typeString: string): IssueType {
      const type = IssueType[typeString];
      if (type === undefined) {
        return IssueType.UNKNOWN;
      }
    
      return type;
    }
    

    如果正确解析了枚举,那么'll end up as the proper type. Otherwise, it'将是 undefined 并且您可以拦截它并返回您的 UNKNOWN 案例 . 如果您更喜欢使用 undefined 作为未知案例,则可以从尝试的枚举解析中返回任何结果 .

    从那里开始,只需要使用解析函数并使用新的强类型变量 .

    const strongIssueType: IssueType = parseIssueType('ACTION');
    // IssueType.ACTION
    const wrongIssueType: IssueType = parseIssueType('UNEXPECTED');
    // IssueType.UNKNOWN
    

相关问题