TypeScript：如何修改makeRequest以兼容多类请求数据接口？

你的问题核心在于带字符串索引签名的类型与固定属性接口的类型兼容规则：TypeScript要求，当把一个没有索引签名的类型赋值给带有索引签名的类型时，会触发类型不兼容错误——因为前者只保证存在指定的固定属性，不保证能支持任意字符串键的访问，而后者的索引签名意味着可以访问任意字符串键。

下面提供两种可行的修改方案：

方案一：用泛型约束兼容所有符合条件的类型 #

无需修改现有小型接口，直接修改makeRequest的参数类型，通过泛型约束限定传入的类型必须满足「键为string、值为number | string | File」的条件：

interface RequestData {
  [key: string]: number | string | File;
}

// 修改makeRequest为泛型函数，约束T的结构
function makeRequest<T extends Record<string, number | string | File>>(data: T) {
  // Do something with data...
}

interface UserRequestData {
  id: number;
  email: string;
  username: string;
}

function updateUser(userData: UserRequestData) {
  makeRequest(userData); // 不再报错
}

这种方式的优势是不需要改动已有的UserRequestData等接口，同时能确保传入的类型符合值类型要求。

方案二：让小型接口继承RequestData #

如果希望所有请求数据接口都强制遵循RequestData的类型规范，可以让它们直接继承RequestData，这样会自动继承索引签名，同时TypeScript会检查接口内的属性是否符合值类型要求：

interface RequestData {
  [key: string]: number | string | File;
}

interface UserRequestData extends RequestData {
  id: number;
  email: string;
  username: string;
}

interface ItemRequestData extends RequestData {
  // 自定义属性，必须符合值类型要求
}

function makeRequest(data: RequestData) {
  // Do something with data...
}

function updateUser(userData: UserRequestData) {
  makeRequest(userData); // 正常通过检查
}

这种方式适合需要统一规范所有请求数据结构的场景，能提前发现属性类型不符合要求的问题。

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