TypeScript方括号内动态构建对象key报错，显式指定keyof类型却正常是什么原因？

核心原因是TypeScript对模板字符串的默认类型推导规则不同 #

两种写法的具体差异如下：

• 第一种写法里，${role}Naming 是未显式标注类型的模板字符串，TypeScript 默认会将它推导为通用的 string 类型，而你的 GroupResponse 类型没有定义允许任意字符串索引的签名，所以用 string 类型的值去索引对象时就会触发报错。
• 第二种写法里，你给变量 namingKey 显式标注了 keyof GroupResponse 类型，此时TypeScript会先做合法性校验：确认所有可能的 role 取值拼接上Naming之后，都属于 GroupResponse 的已知属性集合，校验通过后这个变量的类型就被确定为对象的合法属性键，再用它索引对象自然不会报错。

如果不想单独声明变量，也可以直接对模板字符串做类型断言，写法如下：

getRoleNaming(role: Exclude<Role, 'group-admin'>) {
  return this.currentGroup?.[`${role}Naming` as keyof GroupResponse];
}

内容的提问来源于stack exchange，提问作者stampaaaron