如何在TypeScript中传递函数及其参数并保持强类型？

当然可以实现这个需求，核心是利用TypeScript的泛型和内置的Parameters、ReturnType工具类型，让包装函数的参数和返回值类型与传入的目标函数自动关联。

完整实现代码 #

首先定义你给出的三个目标函数：

const firstFunc = (param1: string, param2: number): string => {
  return `${param1}${param2}`;
};

const secondFunc = (param1: boolean): void => {
  console.log(param1);
};

const thirdFunc = (): number => {
  return 123;
};

然后定义符合类型约束的myFunc：

const myFunc = <T extends (...args: any[]) => any>(
  someFunc: T,
  params: Parameters<T>
): ReturnType<T> => {
  return someFunc(...params);
};

验证强类型效果 #

正确调用示例

// 传入firstFunc：params必须为[string, number]，返回值类型为string
const result1 = myFunc(firstFunc, ["hello", 42]);
console.log(result1); // 类型推断为string

// 传入secondFunc：params必须为[boolean]，返回值类型为void
myFunc(secondFunc, [true]);

// 传入thirdFunc：params必须为空元组，返回值类型为number
const result3 = myFunc(thirdFunc, []);
console.log(result3); // 类型推断为number

错误调用会被TypeScript直接拦截

// ❌ 错误：params类型不匹配firstFunc的[string, number]要求
myFunc(firstFunc, [123, "hello"]);

// ❌ 错误：secondFunc仅接受1个boolean参数，传入了2个参数
myFunc(secondFunc, [true, 123]);

// ❌ 错误：thirdFunc不需要参数，传入了多余内容
myFunc(thirdFunc, ["test"]);

核心原理说明 #

• <T extends (...args: any[]) => any>：泛型T被约束为任意函数类型，用于捕获传入目标函数的具体类型
• Parameters<T>：TypeScript内置工具类型，自动提取函数T的参数列表，返回对应的元组类型
• ReturnType<T>：内置工具类型，自动提取函数T的返回值类型

通过这几个特性，myFunc可以完全适配不同目标函数的类型要求，实现强类型约束的同时保持灵活性。

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