如何在多个回调函数中正确定义TypeScript类型

你可以通过给类型添加泛型参数或者让函数成为泛型函数的方式，彻底替代data: any的不安全写法，同时完美匹配每个回调的明确类型：

方案一：给Test类型添加泛型参数 #

这种方式适合保留多个独立fn函数的场景，通过泛型绑定每个fn对应的回调参数类型：

type Test<T> = {
    callback: (data: T) => void;
}

function callback1(data: string): void {
    console.log('callback 1');
}

function callback2(data: number): void {
    console.log('callback 2');
}

function fn1({ callback }: Test<string>) {
    callback('val1');
}

function fn2({ callback }: Test<number>) {
    callback(1);
}

fn1({ callback: callback1 });
fn2({ callback: callback2 });

每个fn函数通过指定Test<T>的具体类型，强制要求传入的callback必须接受对应类型的参数，既避免了any，也能精准匹配各个回调的类型定义，新增fn时只需要指定对应的泛型即可。

方案二：复用泛型函数 #

如果你的fn逻辑类似，只是传入的数据和回调不同，可以把fn改成泛型函数，让TypeScript自动推导类型：

function callback1(data: string): void {
    console.log('callback 1');
}

function callback2(data: number): void {
    console.log('callback 2');
}

function fn<T>({ callback }: { callback: (data: T) => void }, data: T) {
    callback(data);
}

fn({ callback: callback1 }, 'val1');
fn({ callback: callback2 }, 1);

调用时TypeScript会根据传入的回调和数据自动推导泛型T的类型，确保回调参数和传入数据的类型完全一致，无需手动定义多个fn函数，更简洁灵活。

为什么之前的泛型写法无效 #

你之前尝试的callback: <T>(data:T) => void是让回调自身成为泛型函数，意味着回调可以接受任意类型的参数，这和你希望“回调已有明确类型”的需求不符。正确的做法是将泛型绑定在外部类型或函数层面，固定回调的参数类型，而非让回调本身支持任意类型。

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