TypeScript运行时错误：无法读取undefined的属性POST（枚举问题）

这个问题我之前也碰到过，其实是TypeScript里const enum的特性在搞鬼！

错误原因 #

你定义的是const enum RESTMethod，这是TypeScript的常量枚举，它的核心特性是在编译阶段会被完全内联到使用的地方，不会生成对应的JavaScript对象。正常情况下，RESTMethod.POST编译后会直接变成字符串"POST"，不会保留RESTMethod这个对象。

但你的代码转译后，运行时却在尝试访问RESTMethod这个不存在的对象，自然就会抛出Cannot read property 'POST' of undefined的错误。

解决方案 #

有两种方法可以解决这个问题：

方案1：将const enum改为普通enum

把常量枚举改成普通枚举，这样编译后会生成对应的JavaScript对象，运行时就能正常访问枚举属性了：

// RESTConfig.ts
export enum RESTMethod { 
  POST = "POST", 
  GET = "GET" 
} 

export interface RESTConfig { 
  url: string; 
  method: RESTMethod; 
  data: any; 
}

方案2：开启preserveConstEnums编译选项

如果你一定要保留const enum的编译内联优化特性，可以在tsconfig.json里开启preserveConstEnums选项，这样TypeScript编译时会额外生成对应的枚举对象，同时保留内联行为：

// tsconfig.json
{
  "compilerOptions": {
    "preserveConstEnums": true,
    // 其他编译配置...
  }
}

修改后重新编译代码，运行时就不会再出现这个错误啦！

内容的提问来源于stack exchange，提问作者Yuri van Geffen