TypeScript如何基于索引签名自动推断泛型类型

问题原因 #

TypeScript 语法规则不支持变量直接标注泛型类型时自动推导泛型参数，你定义的GenericInterface是需要传入1个泛型参数的泛型类型，直接写const fileInfoA: GenericInterface不符合语法要求，所以会抛错。

解决方案 #

借助泛型函数的类型自动推导能力实现需求，泛型函数调用时 TypeScript 会自动根据入参的实际类型推导出泛型参数的具体值，不需要你手动定义列名联合类型，也不会产生冗余代码。

完整实现代码如下：

interface GenericInterface<T extends string> {
    cols: {
        [key in T]: string | number;
    },
}

// 仅新增一个无运行时开销的泛型工具函数
function createFileInfo<T extends string>(info: GenericInterface<T>) {
    return info;
}

// 直接传入配置即可，无需手动指定泛型参数
const fileInfoA = createFileInfo({
    cols: {
        NAME: 'A',
        COUNTRY: 'B',
        // 哪怕有200+列，直接在这里写即可，不需要额外定义类型
    },
});

效果验证 #

此时fileInfoA的类型会被自动推导为GenericInterface<'NAME' | 'COUNTRY'>，后续访问fileInfoA.cols时IDE会自动弹出所有列名的补全提示，写入不存在的列名时 TypeScript 也会直接抛出类型错误，完全符合你的使用要求。

createFileInfo工具函数仅做类型推导用，编译为JavaScript后就是原封不动返回入参的空逻辑，不会产生任何运行时额外开销。

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