如何结合两种方案实现TypeScript函数参数的类型安全与自动补全？

目标是实现一个最多接受3个参数的函数，参数类型由TMessageTypeMap对象定义，需要同时满足：

• 调用函数时的类型安全与自动补全
• 函数内部的类型安全与自动补全

现有两种实现变体，但各自存在缺陷，希望结合两者优势：

export type TMessageTypeMap = {
    event: TEventTypeMap;
    config: TConfigTypeMap;
};

export type TConfigTypeMap = {
    login: {
        value1: string;
    };
    logout: {
        value2: number;
    };
};

export type TEventTypeMap = {
    eventNo1: {
        e1Param1: number;
        e1Param2: string;
    };
    eventNo2: {
        e2Param1: string;
        e1Param2: number;
    };
};

// 方法1：接口定义函数类型
export interface IMessageFunction {
    <K extends keyof TMessageTypeMap, T extends keyof TMessageTypeMap[K]>(
        messageCategory: K,
        eventType: T,
        parameters: TMessageTypeMap[K][T],
        callback?: (evt?: any) => void
    ): void;
}

// 方法2：元组类型推导
export type KeyKeyValue<O> = {
    [K in keyof O]: {
        [T in keyof O[K]]: [K, T, O[K][T], (evt?: any)=>void];
    }[keyof O[K]];
}[keyof O];

export type TMessageTupleType = KeyKeyValue<TMessageTypeMap>;

// 方法1实现：调用时补全正常，但内部类型无法推导
const functionMessageFunction: IMessageFunction = (category, type, params, callback) => {
    if (category === "event") {
        // 此处无法正确推导type的合法值，params类型也无法关联
        if (type === "pi") { // 错误值不会被类型检查拦截
        }
    }
};

// 方法2实现：内部类型推导准确，但调用时补全异常
const functionMessageTupleType: (...args: TMessageTupleType) => void = (category, type, params, callback) => {
    if (category === "event") {
        if (type === "eventNo1") {
            // params类型正确推导，可访问e1Param1
            params.e1Param1;
        }
    }
};

// 方法1调用：仅允许合法参数组合，补全正常
const result = functionMessageFunction("event", "eventNo1", {
    e1Param1: 1, e1Param2: "jkasdf"
});

// 方法2调用：错误参数组合被允许，合法组合反而可能报错
const result2 = functionMessageTupleType('event', "login", {
    value2: 1
});
const result2Variant = functionMessageTupleType('event', "eventNo1", {
    e1Param1: 123
});

解决方案：结合泛型与类型守卫实现双向类型安全 #

通过泛型函数定义保证调用时的类型补全，同时在函数内部使用分支类型守卫让TypeScript正确推导参数关联关系：

// 最终实现：调用时泛型约束提供补全，内部分支自动推导类型
const messageHandler = <K extends keyof TMessageTypeMap, T extends keyof TMessageTypeMap[K]>(
    category: K,
    type: T,
    params: TMessageTypeMap[K][T],
    callback?: (evt?: any) => void
) => {
    // 针对event分类的分支，自动约束type和params的类型
    if (category === "event") {
        if (type === "eventNo1") {
            // params自动推导为eventNo1对应的类型
            console.log(params.e1Param1, params.e1Param2);
        } else if (type === "eventNo2") {
            console.log(params.e2Param1, params.e1Param2);
        }
    }

    // 针对config分类的分支，自动约束type和params的类型
    if (category === "config") {
        if (type === "login") {
            console.log(params.value1);
        } else if (type === "logout") {
            console.log(params.value2);
        }
    }
};

// 调用测试：补全正常，类型检查严格
messageHandler("event", "eventNo1", { e1Param1: 123, e1Param2: "test" });
messageHandler("config", "login", { value1: "admin" });
// 错误参数会被类型检查拦截
// messageHandler("event", "login", { value1: "err" }); // 编译报错
// messageHandler("config", "eventNo1", { e1Param1: 456 }); // 编译报错

方案说明 #

1. 调用时类型安全：通过泛型<K extends keyof TMessageTypeMap, T extends keyof TMessageTypeMap[K]>约束参数关联关系，TypeScript会自动补全合法的category、type及对应params结构。
2. 内部类型安全：在函数内部通过精确的if (category === "xxx")分支，TypeScript会自动缩小category的类型范围，进而关联推导type和params的具体类型，无需额外类型断言。

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