TypeScript泛型混用映射类型时属性类型计算异常问题求助

问题根源 #

你定义的QueryParamObject映射类型在处理具体类型时能正常工作，但遇到TExtra & Concrete这种泛型交叉类型时，TypeScript无法精准推断属性类型，核心原因是：

• 泛型参数TExtra属于未确定类型，TypeScript无法预判它是否包含与Concrete同名的属性，甚至可能修改这些属性的类型结构。
• 对于交叉类型的属性，TypeScript会将(TExtra & Concrete)[key]视为模糊的联合类型，无法确定它是否符合Array<string | number>的条件，因此只能返回string | string[]的兜底联合类型，导致类型赋值错误。

解决方案 #

方案一：拆分交叉类型，分别处理已知与泛型属性 #

直接将QueryParamObject<TExtra & Concrete>拆分为QueryParamObject<Concrete> & QueryParamObject<TExtra>，让TypeScript先明确已知的Concrete属性转换后的类型，再合并泛型部分的转换结果：

export type QueryParamObject<TInput> = {
    [key in keyof TInput]: TInput[key] extends Array<string | number> ? string[] : string;
};

type Concrete = {
    numberProp: number;
    numberArray: number[];
    stringArray: string[];
}

function read<TExtra>(arg: QueryParamObject<Concrete> & QueryParamObject<TExtra>): void {
    const arr1: string[] = arg.numberArray; // 类型推断正确，为string[]
    const prop1: string = arg.numberProp; // 类型推断正确，为string
    // TExtra中的属性也会被正确转换为string或string[]
}

方案二：优化条件类型，使用分布式判断确保精准推断 #

通过抽离辅助类型实现分布式条件判断，让TypeScript对交叉类型中的每个属性单独进行类型检查，避免把整个属性类型当成模糊的联合：

// 辅助类型：判断单个类型是否为string/number数组
type IsStringOrNumberArray<T> = T extends Array<string | number> ? true : false;

export type QueryParamObject<TInput> = {
    [key in keyof TInput]: IsStringOrNumberArray<TInput[key]> extends true ? string[] : string;
};

type Concrete = {
    numberProp: number;
    numberArray: number[];
    stringArray: string[];
}

function read<TExtra>(arg: QueryParamObject<TExtra & Concrete>): void {
    const arr1: string[] = arg.numberArray; // 类型推断正确
    const prop1: string = arg.numberProp; // 类型推断正确
}

这种方式下，TypeScript会优先使用Concrete中已知的属性类型进行条件判断，规避交叉类型带来的模糊性，从而精准返回对应的string或string[]类型。

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