TypeScript带非判别模板字面量的可区分联合类型赋值报错解析与修复

问题代码 #

export interface A {
  label: string;
  kind: "A";
}

export interface B {
    label: `Baz ${number}`;
    kind: "B";
}

// 在另一个文件中...
type SubUnion = A | B;
const createObj = (): SubUnion[] => {
  const x = true;
  const n1 = 3;
  const n2 = 5;
  const result: SubUnion[] = [
    { label: "Foo", kind: "A" },
    { label: "Bar", kind: "A" },
    {
/*
Type '{ label: string; kind: "B"; }' is not assignable to type 'SubUnion'.
  Types of property 'kind' are incompatible.
    Type "B" is not assignable to type "A".(2322)
*/
      label: `Baz ${x ? n1 : n2}`,
      kind: "B",
    },
  ];
  return result;
};

核心疑问 #

我能理解第一行错误的原因：label: Baz ${x ? n1 : n2}``被TypeScript推断为string类型，而B接口要求的是Baz ${number}模板字面量类型，所以类型不匹配。但我搞不懂错误信息的最后两行——为什么会提示Type "B" is not assignable to type "A"？

我找到了几种修复方法，但不确定哪种才是正确的：

• 方案1：给整个数组断言为const

  const result: SubUnion[] = [
    { label: "Foo", kind: "A" },
    { label: "Bar", kind: "A" },
    {
      label: `Baz ${x ? n1 : n2}`,
      kind: "B",
    },
  ] as const;
  

• 方案2：给B类型的对象添加satisfies B约束

  {
    label: `Baz ${x ? n1 : n2}`,
    kind: "B",
  } satisfies B,
  

• 方案3：给B类型的对象断言为const

  {
    label: `Baz ${x ? n1 : n2}`,
    kind: "B",
  } as const,
  

• 方案4：给label字段添加satisfies Baz ${number}``约束

  {
    label: `Baz ${x ? n1 : n2}` satisfies `Baz ${number}`,
    kind: "B",
  },
  

• 方案5：给label字段断言为const

  {
    label: `Baz ${x ? n1 : n2}` as const,
    kind: "B",
  },
  

我觉得as const不是最佳选择，因为它允许使用和左侧类型不匹配的字面量。satisfies看起来更合适，但不确定是否正确。想请教两个问题：

1. 这个错误信息为什么会这么令人困惑？
2. 有没有更优的修复方案？

解答 #

1. 错误信息困惑的原因

TypeScript处理联合类型赋值时，会逐个尝试将对象匹配联合中的每个类型。首先它会尝试匹配A类型：

• A要求kind为"A"，但当前对象的kind是"B"，这触发了kind不兼容的错误。
• 同时当前对象的label是string类型，和A的label类型兼容，所以TypeScript会优先反馈kind的不匹配问题，导致错误信息指向"B"无法赋值给"A"，而非直接点明label的类型不匹配才是根本原因。

这种提示是TypeScript类型检查器的逻辑导致的：当联合类型匹配失败时，它会报告第一个检测到的不匹配细节，而非最核心的问题，因此出现了看似矛盾的提示。

2. 最优修复方案

推荐使用方案2或方案4，也就是利用satisfies关键字：

• satisfies的作用是验证表达式类型是否符合指定类型，但不会改变表达式的推断类型，既保证类型安全，又不会像as const那样过度窄化类型，也不会像类型断言那样绕过类型检查。

比如方案2：

{
  label: `Baz ${x ? n1 : n2}`,
  kind: "B",
} satisfies B

这个方案直接验证整个对象符合B类型，TypeScript会自动检查label是否符合Baz ${number}的要求，同时保留label的实际类型（Baz 3 | Baz 5），不会破坏类型推断的灵活性。

如果只想单独约束label字段，方案4也可行，但方案2更直观，直接针对整个B类型验证，代码可读性更高。

另外，也可以通过显式标注对象类型修复：

{
  label: `Baz ${x ? n1 : n2}`,
  kind: "B",
} as B

但这种类型断言的方式不如satisfies安全——如果后续修改对象结构不符合B类型，TypeScript不会报错，而satisfies会及时提示。

综上，使用satisfies B是最优的修复方案，它既能保证类型安全，又能保留类型推断的优势，同时代码意图清晰。

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