TypeScript：嵌套readonly属性时类型守卫未按预期工作

我来帮你拆解这个问题～你提到的普通场景下类型守卫正常工作，但嵌套readonly属性时就失效，其实是TypeScript类型系统对嵌套readonly结构的窄化逻辑导致的小坑。

先明确问题场景 #

先把你给出的正常代码补全，再构造一个嵌套的失效场景，方便对比：

正常工作的普通场景 #

enum GoodBad { Good = 'Good', Bad = 'Bad' }
interface IQuality { readonly type: GoodBad; }
interface GoodQuality extends IQuality { readonly type: GoodBad.Good; score: number; }
interface BadQuality extends IQuality { readonly type: GoodBad.Bad; reason: string; }
type Quality = GoodQuality | BadQuality;

let quality: Quality;
if (quality.type === GoodBad.Good) {
  let goodQuality: GoodQuality = quality; // 无问题，类型守卫正常生效
}

失效的嵌套readonly场景 #

// 新增一个嵌套了readonly Quality的接口
interface Item { readonly quality: Quality; }
let item: Item;

if (item.quality.type === GoodBad.Good) {
  // ❌ 报错：无法将类型Quality分配给GoodQuality
  let goodQuality: GoodQuality = item.quality;
}

原因分析 #

TypeScript对联合类型的类型窄化，依赖于它能识别到当前访问的属性是联合类型的判别式，并且能追踪这个属性的类型关联。但在嵌套readonly场景下：

• 外层的Item是readonly对象，item.quality被TypeScript视为一个"只读引用"
• TypeScript默认不会递归地将外层的条件判断（item.quality.type === GoodBad.Good）关联到内层的quality属性上，它会认为这个只读引用的类型可能在判断后发生变化（虽然实际readonly不能修改，但类型系统的处理逻辑在这里有区别），因此不会保留窄化后的类型。

解决方案 #

这里有几种可行的解决方式，按推荐程度排序：

1. 提取嵌套属性到局部变量（最推荐） #

把嵌套的quality属性提取到一个普通局部变量，TypeScript会正确追踪这个变量的类型窄化：

let item: Item;
const currentQuality = item.quality; // 提取到局部变量

if (currentQuality.type === GoodBad.Good) {
  let goodQuality: GoodQuality = currentQuality; // ✅ 正常工作
}

2. 自定义类型守卫函数 #

如果需要频繁处理这种嵌套结构，可以写一个自定义类型守卫，明确告诉TypeScript如何窄化整个嵌套对象的类型：

function isGoodQualityItem(item: Item): item is { readonly quality: GoodQuality } {
  return item.quality.type === GoodBad.Good;
}

let item: Item;
if (isGoodQualityItem(item)) {
  let goodQuality: GoodQuality = item.quality; // ✅ 正常工作
}

3. 使用类型断言（不推荐，仅应急用） #

如果只是临时解决单个场景，可以用类型断言强制指定类型，但这种方式会跳过TypeScript的类型检查，有风险：

let item: Item;
if (item.quality.type === GoodBad.Good) {
  let goodQuality: GoodQuality = item.quality as GoodQuality; // ✅ 可以工作，但不推荐
}

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