TypeScript中colors键为任意字符串时能否约束defaultColorName为其有效键？

原实现的核心问题 #

你最初定义的接口存在跨字段类型无绑定的缺陷：defaultColorName 是宽泛的 string 类型，和 colors 的动态键集没有关联，TS 无法校验写入的默认颜色名是否真实存在于 colors 对象中，这类问题往往要到运行时才会暴露。

实现思路 #

不需要提前定义固定的颜色名字面量联合类型，只需要通过泛型把两个字段的类型做关联：把 colors 对象的键集合作为泛型推导的源头，反过来约束 defaultColorName 的取值范围，让 TS 在实际构造对象的过程中自动收集所有合法的颜色名，完全适配自定义任意颜色名的场景。

具体类型定义 #

// 泛型T会自动从传入的colors对象推导键集，约束值必须为string类型
type ColorPalette<T extends Record<string, string>> = {
  // 严格限定默认值只能是colors对象的已有键
  defaultColorName: keyof T;
  colors: T;
};

实际校验效果 #

• 合法场景：当 defaultColorName 的取值在 colors 的键集合中时，TS 会正常识别不报错

  const validPalette = {
    defaultColorName: "primary",
    colors: {
      primary: "#1677ff",
      success: "#52c41a",
      warning: "#faad14"
    }
  } satisfies ColorPalette<Record<string, string>>;
  

• 非法场景：当默认值是不在 colors 中的字符串时，TS 会直接抛出类型错误

  // 报错："notExist" 不能赋值给 "primary" | "success" 类型
  const invalidPalette = {
    defaultColorName: "notExist",
    colors: {
      primary: "#1677ff",
      success: "#52c41a"
    }
  } satisfies ColorPalette<Record<string, string>>;
  

简化使用的构造函数封装 #

如果不想每次手动关联泛型，可以封装一个通用构造函数，让 TS 自动完成类型推导，不需要手动传入泛型参数：

function createConfig<T extends Record<string, string>>(config: ColorPalette<T>) {
  return config;
}

// 调用时完全自动推导，手写错误的默认值会直接触发类型提示
const myPalette = createConfig({
  defaultColorName: "secondary",
  colors: {
    primary: "#ffffff",
    secondary: "#000000"
  }
});

实现原理 #

这种方式和固定联合类型的泛型写法逻辑完全一致，区别只是去掉了提前硬编码的字面量联合约束，只保留了对值类型的要求：TS 会在你传入对象字面量的瞬间，从 colors 字段的实际内容中提取所有键，组合成动态的字面量联合类型，用来约束 defaultColorName 的取值。不管你自定义多少个颜色名，TS 都会自动更新合法的取值范围，不会出现校验失效的问题。

这套实现逻辑完全不局限于颜色场景，所有需要“某字段取值必须关联另一个对象的已有键”的动态配置场景，都可以复用这套泛型推导方案，不需要提前硬编码固定的键值联合类型。

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