TypeScript中如何无需显式类型实现回调参数自动推断？

问题背景 #

现有如下TypeScript函数：

function example<T>(
  ...[callback, batch]:
    | [callback: (param: T) => void, batch?: false]
    | [callback: (param: T[]) => void, batch: true]
) {
  if (batch) {
    callback([]);
  } else {
    callback({} as T);
  }
}

我们期望调用该函数时，callback的参数类型能被TypeScript自动推断：

example<string>((param) => {});        // 期望param类型为string
example<string>((param) => {}, true);  // 期望param类型为string[]

但实际调用时会触发类型错误：

error TS7006: Parameter 'param' implicitly has an 'any' type.

example<string>((param) => {});
                 ~~~~~

error TS7006: Parameter 'param' implicitly has an 'any' type.

example<string>((param) => {}, true);
                 ~~~~~

虽然显式指定参数类型可以解决问题，但TypeScript已有足够信息完成自动推断，因此希望找到无需显式指定参数类型的实现方式。

解决方案：使用函数重载 #

将原函数改为函数重载的写法，TypeScript的类型推断系统能更好地关联参数组合与回调类型：

// 重载签名1：无batch参数或batch为false时，回调接收单个T类型参数
function example<T>(callback: (param: T) => void): void;
// 重载签名2：batch为true时，回调接收T[]类型参数
function example<T>(callback: (param: T[]) => void, batch: true): void;
// 函数实现签名
function example<T>(
  callback: ((param: T) => void) | ((param: T[]) => void),
  batch?: boolean
) {
  if (batch) {
    (callback as (param: T[]) => void)([]);
  } else {
    (callback as (param: T) => void)({} as T);
  }
}

效果验证 #

修改后再调用函数，TypeScript会自动正确推断回调参数的类型：

example<string>((param) => {});        // param自动推断为string
example<string>((param) => {}, true);  // param自动推断为string[]

原理说明 #

原函数使用联合元组的写法，虽然语法合法，但TypeScript无法将batch参数的取值与回调的参数类型建立明确的关联。而函数重载通过定义多个明确的签名分支，让TypeScript能根据传入的参数组合，精准匹配对应的类型约束，从而自动完成回调参数的类型推断。

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