如何从不同属性的TypeScript联合类型中提取属性类型？

要实现从联合类型中提取某个非公共属性的类型（不管该属性是否存在于所有联合成员中），你可以自定义一个工具类型来遍历联合类型的每个成员，提取符合条件的属性类型：

type UnionProperty<T, K extends PropertyKey> = T extends { [P in K]: infer U } ? U : never;

用法示例 #

场景1：目标属性仅存在于部分联合成员中

对应你给出的初始类型：

type VERTICAL = {
    up: string
    down: string
}
type HORIZONTAL = {
    left: string
    right: string
}

type DIRECTIONS = VERTICAL | HORIZONTAL

// 获取"left"属性的类型，结果为string
type TEST = UnionProperty<DIRECTIONS, "left">;

场景2：目标属性存在于多个联合成员且类型不同

当VERTICAL也包含left属性且类型为number时：

type VERTICAL = {
    up: string
    down: string
    left: number
}
type HORIZONTAL = {
    left: string
    right: string
}

type DIRECTIONS = VERTICAL | HORIZONTAL

// 结果为string | number
type TEST = UnionProperty<DIRECTIONS, "left">;

场景3：目标属性不存在于任何联合成员中

type VERTICAL = {
    up: string
    down: string
}
type HORIZONTAL = {
    right: string
}

type DIRECTIONS = VERTICAL | HORIZONTAL

// 结果为never
type TEST = UnionProperty<DIRECTIONS, "left">;

原理说明 #

TypeScript默认不允许直接访问联合类型的非公共属性（这就是你遇到2339错误的原因），而UnionProperty工具类型通过条件类型遍历联合成员的特性，逐个检查每个成员是否包含目标属性：

• 如果成员包含该属性，就用infer提取其类型；
• 如果不包含，则返回never；
• 最终所有提取到的类型会自动合并为联合类型，若没有匹配的属性则整体返回never。

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