如何在TypeScript接口中定义匹配特定前缀的动态属性类型？

要实现为myVar${动态字符串}这类前缀匹配的属性指定string类型，同时保留其他属性string|number的通用约束，可以借助TypeScript 4.1及以上版本支持的模板字面量类型来实现，具体步骤如下：

1. 定义前缀匹配的键类型 #

首先用模板字面量类型明确所有以myVar开头的键：

// 匹配所有形如"myVarxxx"的字符串键
type MyVarPrefixedKey = `myVar${string}`;

2. 重构VariablesType接口 #

将更具体的前缀索引签名放在通用索引签名之前（TypeScript会优先匹配更精确的类型），确保前缀属性被约束为string：

interface VariablesType {
  // 优先匹配：所有myVar开头的键，类型强制为string
  [key: MyVarPrefixedKey]: string;
  // 通用匹配：其他所有键，类型为string|number
  [key: string]: string | number;
  // 保留原有的固定myVar属性（如果需要）
  myVar: string;
}

这样，当你为myVar${动态值}的属性赋值时，TypeScript会自动校验值的类型必须是string，而其他属性则允许string或number类型。

3. 配合运行时校验（可选但推荐） #

因为JSON加载/保存是运行时操作，为了避免外部非法数据破坏类型约束，可以在Variables类的赋值逻辑中添加前缀检查：

class Variables {
  private data: VariablesType;

  constructor() {
    this.data = this.load();
  }

  // 加载variables.json的逻辑
  private load(): VariablesType {
    // 实际项目中可替换为fs或fetch等加载逻辑
    return JSON.parse(JSON.stringify({ myVar: "default" }));
  }

  // 保存到variables.json的逻辑
  save(): void {
    // 实际项目中可替换为fs写入逻辑
    console.log("Saved data:", this.data);
  }

  set(key: string, value: string | number): void {
    if (key.startsWith("myVar")) {
      if (typeof value !== "string") {
        throw new Error(`myVar前缀属性必须赋值为string类型，当前key: ${key}，传入值类型: ${typeof value}`);
      }
      // 类型断言告诉TS这个key符合前缀类型
      this.data[key as MyVarPrefixedKey] = value;
    } else {
      this.data[key] = value;
    }
  }

  get(key: string): string | number {
    return this.data[key];
  }
}

是否有更佳方案？ #

上述模板字面量+索引签名的方案已经是最直接的静态类型约束方式，如果你的场景中动态属性的前缀规则更复杂（比如包含特定格式的后缀），可以进一步结合正则字面量类型（TypeScript 4.4+支持）来细化约束。另外，若动态属性的数量和命名有预期范围，也可以用映射类型批量生成属性，但对于完全动态的前缀场景，模板字面量索引签名是最优选择。

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