如何让TypeScript的validateField函数参数自动匹配指定函数参数？

问题场景 #

现有一组返回布尔值的校验函数集合：

const fns = {
  isValidDate: (input: string, min?: Date, max?: Date): boolean => {
     // 具体校验逻辑
     return true;
  },

  isValidOption: (input: string, options: string[]): boolean => {
     // 具体校验逻辑
     return true;
  },
};

还有一个调用这些函数的validateField函数：

function validateField(where: string, fn: keyof typeof fns, ...args: any[]){
   // 额外逻辑（比如日志、错误记录等）
   return fns[fn](...args);
}

需求很明确：让args参数自动匹配所选fn的参数类型，比如调用validateField("test", "isValidDate", "2024-01-01")合法，但传123这种不匹配的类型就要报错，同时VSCode要能正确显示参数提示，还不想手动写一堆重复的函数重载。

解决方案 #

用TypeScript的泛型结合内置类型工具就能搞定，不用手动写重载：

重构validateField函数 #

直接修改函数的类型定义，利用泛型约束和Parameters工具类型实现自动推导：

// 先提取函数集合的类型，方便复用
type ValidationFns = typeof fns;

function validateField<K extends keyof ValidationFns>(
  where: string,
  fn: K,
  ...args: Parameters<ValidationFns[K]>
) {
  // 这里可以保留原有的额外逻辑，比如日志、错误处理
  return fns[fn](...args);
}

效果验证 #

• 合法调用：validateField("test", "isValidDate", "2024-01-01", new Date())，参数完全匹配，VSCode会准确提示对应函数的参数类型
• 非法调用：validateField("test", "isValidDate", 123)，TypeScript直接报错，因为第一个参数要求是string而非number
• 调用isValidOption时：validateField("test", "isValidOption", "option1", ["option1", "option2"])，参数类型自动匹配，无报错

原理说明 #

• K extends keyof ValidationFns：把泛型K限制为校验函数集合的键名，也就是只能传"isValidDate"或"isValidOption"
• Parameters<ValidationFns[K]>：TypeScript自带的工具类型，专门用来提取指定函数的参数列表类型。当你选定了fn的键名后，这个工具会自动返回对应函数的参数类型数组，让args完全匹配，实现自动类型校验和提示。

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