如何为ExtraInterface的backToStage指定嵌套对象SCENES的取值类型？

现有如下对象：

export const SCENES = {
  GREETING: 'scene:greeting',
  PROFILE: 'scene:profile',
  PURCHASES: 'scene:purchases',
  BALANCE: {
    ENTER_AMOUNT: 'scene:balance:enterAmount',
    INVOICE: 'scene:balance:invoice',
  },
};

以及如下接口：

interface ExtraInterface {
  backToStage?: something; // 需要取上述对象中某一元素的值
}

需求是让backToStage属性只能取SCENES对象中包含的所有值（包括嵌套层级的），实现方式如下：

实现步骤 #

1. 定义递归类型提取所有层级的字符串值 #

首先需要一个递归类型，用来遍历对象的所有层级，提取所有叶子节点的字符串类型：

// 递归提取对象所有层级的字符串值类型
type ExtractSceneValues<T> = T extends string 
  ? T 
  : { [K in keyof T]: ExtractSceneValues<T[K]> }[keyof T];

2. 生成SCENES所有值的联合类型 #

通过typeof SCENES获取对象的类型，再用上面的递归类型提取所有值的联合类型：

type SceneValues = ExtractSceneValues<typeof SCENES>;

此时SceneValues的类型等价于：

type SceneValues = 'scene:greeting' | 'scene:profile' | 'scene:purchases' | 'scene:balance:enterAmount' | 'scene:balance:invoice';

3. 修改接口的属性类型 #

把ExtraInterface中的backToStage类型替换为SceneValues：

interface ExtraInterface {
  backToStage?: SceneValues;
}

效果验证 #

此时backToStage只能赋值为SCENES中定义的任意字符串值，传入其他值会触发TypeScript类型错误，比如：

// 合法赋值
const validExtra: ExtraInterface = {
  backToStage: SCENES.BALANCE.INVOICE
};

// 非法赋值，TypeScript会报错
const invalidExtra: ExtraInterface = {
  backToStage: 'scene:unknown' // 类型“"scene:unknown"”不能赋值给类型“SceneValues”
};

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