TypeScript：如何为动态键值对象定义键为字符串值为字符串或数字的接口

你可以通过索引签名或者 TypeScript 内置的Record工具类型实现需求，有两种常用写法：

写法1：直接内联索引签名 #

直接在externalObject的类型定义里声明索引规则即可：

interface TestObject{
  // [key: string] 限定键为字符串类型，值限定为字符串或数字类型
  externalObject?: {
    [key: string]: string | number
  }
}

写法2：抽离复用类型（推荐多处使用的场景） #

如果这个动态键值对象类型会在多个地方用到，可以单独抽成公共类型，搭配内置Record工具类写起来更简洁：

// Record<键类型, 值类型>是索引签名的语法糖，效果和手动写索引签名完全一致
type StringKeyStrOrNumVal = Record<string, string | number>

interface TestObject{
  externalObject?: StringKeyStrOrNumVal
}

补充说明 #

• 如果后续需要扩展值的允许类型，只需要修改联合类型即可，比如要支持布尔值就把值类型改为string | number | boolean
• 如果允许键为数字类型（JS 运行时数字键最终也会被转为字符串），可以把键类型改为string | number，对应写法为Record<string | number, string | number>

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