如何基于DRY原则精简两个键名不同的相似TypeScript接口

你可以通过TypeScript映射类型+自定义大小写转换工具类型实现DRY原则，只需要维护一份字段类型定义，就能自动生成两种命名风格的独立接口。

方法一：基于下划线结构生成驼峰接口 #

先实现下划线转驼峰的工具类型，再定义唯一的下划线结构，最后通过映射类型生成驼峰接口：

// 下划线转驼峰的工具类型
type SnakeToCamel<S extends string> = S extends `${infer T}_${infer U}`
  ? `${T}${Capitalize<SnakeToCamel<U>>}`
  : S;

// 维护唯一的下划线结构定义
type BaseSnakeStructure = {
  key_one: string;
  key_two: number;
};

// JSON格式接口直接复用基础结构
interface MyJsonInterface extends BaseSnakeStructure {}

// 自动生成驼峰式接口
interface MyInterface {
  [K in keyof BaseSnakeStructure as SnakeToCamel<K>]: BaseSnakeStructure[K];
}

方法二：基于驼峰结构生成下划线接口 #

如果更习惯维护驼峰结构，可反过来实现驼峰转下划线的工具类型：

// 驼峰转下划线的工具类型
type CamelToSnake<S extends string> = S extends `${infer T}${infer U}`
  ? T extends Capitalize<T>
    ? `_${Lowercase<T>}${CamelToSnake<U>}`
    : `${T}${CamelToSnake<U>}`
  : S;

// 维护唯一的驼峰结构定义
type BaseCamelStructure = {
  keyOne: string;
  keyTwo: number;
};

// JavaScript格式接口直接复用基础结构
interface MyInterface extends BaseCamelStructure {}

// 自动生成下划线格式接口
interface MyJsonInterface {
  [K in keyof BaseCamelStructure as CamelToSnake<K>]: BaseCamelStructure[K];
}

效果说明 #

两种方式都只需要维护一份核心的字段类型定义，另一个接口完全通过类型推导生成，既避免了代码重复，又保证两个接口的键名完全独立（一个下划线、一个驼峰），完全符合需求。

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