如何通过TypeScript类型系统约束FashionVictim的颜色一致性

要实现静态类型层面强制FashionVictim的所有clothes颜色与favoriteColor一致，核心是通过TypeScript泛型将两者的颜色类型绑定，同时封装数据避免外部篡改。以下是具体实现方案：

1. 定义带颜色约束的基础类型 #

首先重构Cloth为泛型类型，锁定其颜色类型；再用泛型接口FashionVictim绑定favoriteColor与衣物颜色：

// 假设Color是预定义的颜色联合类型（可替换为枚举或其他类型）
type Color = "red" | "blue" | "green";

// 泛型Cloth：颜色类型C被固定，确保color只能是C类型
type Cloth<C extends Color> = {
  color: C;
  type: "T-shirt" | "Skirt" | "Pants";
};

// 泛型FashionVictim：favoriteColor与所有clothes的颜色统一为C
interface FashionVictim<C extends Color> {
  favoriteColor: C;
  // 用getClothes方法替代直接暴露字段，避免外部修改破坏约束
  getClothes(): Cloth<C>[];
}

2. 实现类型安全的实例创建 #

通过类或工厂函数创建实例，同时保留运行时检查作为兜底（防止类型断言绕过静态检查）：

用类实现

class ConcreteFashionVictim<C extends Color> implements FashionVictim<C> {
  private readonly _clothes: Cloth<C>[];

  constructor(public favoriteColor: C, clothes: Cloth<C>[]) {
    // 运行时兜底检查（可选，防止恶意类型断言绕过静态检查）
    if (clothes.some(item => item.color !== favoriteColor)) {
      throw new Error("所有衣物颜色必须与喜爱颜色一致");
    }
    this._clothes = clothes;
  }

  getClothes(): Cloth<C>[] {
    // 返回数组副本，避免外部修改原数组破坏约束
    return [...this._clothes];
  }
}

用工厂函数实现（更轻量化）

function createFashionVictim<C extends Color>(
  favoriteColor: C,
  clothes: Cloth<C>[]
): FashionVictim<C> {
  if (clothes.some(item => item.color !== favoriteColor)) {
    throw new Error("所有衣物颜色必须与喜爱颜色一致");
  }
  return {
    favoriteColor,
    getClothes: () => [...clothes]
  };
}

3. 静态类型检查效果 #

此时TypeScript会在编译阶段直接拦截不符合约束的代码：

// ✅ 合法：所有衣物颜色与favoriteColor一致
const validVictim = new ConcreteFashionVictim("red", [
  { color: "red", type: "T-shirt" },
  { color: "red", type: "Skirt" }
]);

// ❌ 编译报错：类型"blue"无法赋值给类型"red"
const invalidVictim = new ConcreteFashionVictim("red", [
  { color: "red", type: "T-shirt" },
  { color: "blue", type: "Skirt" }
]);

核心原理 #

通过泛型参数C将favoriteColor的具体颜色类型与Cloth的color类型强绑定，TypeScript的类型系统会强制所有衣物的color必须与favoriteColor属于同一类型分支，从根源上避免不一致的情况。同时封装衣物数组为私有字段并返回副本，确保外部无法修改内部数据破坏约束。

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