如何从TypeScript判别联合类型中提取指定键的类型？

要从判别联合类型中获取特定成员的属性类型，你可以借助TypeScript内置的Extract工具类型，先筛选出包含目标属性的联合成员，再进行索引操作，具体有两种实现方式：

方式一：通过属性存在性筛选 #

直接筛选出联合类型中包含name属性的成员，再提取其类型：

type MyDUnion = { type: "anon"; name: string } | { type: "google"; idToken: string };
type Name = Extract<MyDUnion, { name: unknown }>['name']; // 类型为string

方式二：通过判别式精准筛选 #

利用联合类型的type判别字段，精准定位到type: "anon"的成员，再提取name的类型：

type MyDUnion = { type: "anon"; name: string } | { type: "google"; idToken: string };
type Name = Extract<MyDUnion, { type: "anon" }>['name']; // 类型为string

原理说明 #

直接使用MyDUnion['name']报错的原因是：TypeScript要求联合类型的索引操作必须在所有成员上都存在该属性，而你的联合类型中只有type: "anon"的成员有name，因此需要先通过Extract筛选出符合条件的成员类型，再进行索引就不会触发错误了。

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