TypeScript 如何让接口属性或函数参数类型依赖关联值取值

一、接口Bar的属性关联实现 #

单个静态接口无法实现内部属性的交叉类型约束，因为接口定义的所有属性类型都是独立校验的，没法绑定同对象内其他属性的取值。要实现name的取值决定values的类型，最成熟的方案是把原单一接口改造成可辨识联合类型，以name字段作为可辨识标识，拆分结构后组合成联合类型：

• 保留原有枚举定义

  enum Foo {
      A = 'a',
      B = 'b'
  }
  

• 按name的取值拆分对应结构，最终组合为联合类型：

  // 对应name为Foo.A的结构约束
  interface BarWithA {
      name: Foo.A,
      values: number
  }
  // 对应name为Foo.B的结构约束
  interface BarWithB {
      name: Foo.B,
      values: number[]
  }
  // 最终Bar类型，实现内部属性的关联绑定
  type Bar = BarWithA | BarWithB
  

实现后TS的类型校验逻辑会自动根据name的实际取值收窄类型：

• 当name为Foo.A时，强制要求values必须为number类型，传入数组会触发类型报错
• 当name为Foo.B时，强制要求values必须为number[]类型，传入单数值会触发类型报错

二、函数baz的参数关联实现 #

和接口约束同理，普通单签名函数的参数是独立校验的，无法建立两个参数之间的取值绑定。实现values类型随name参数变化的效果，有两种常用实现方式：

方式1：泛型+条件类型（代码更简洁） #

通过泛型捕获name的实际取值类型，再用条件类型推导values的匹配类型：

// 泛型签名：捕获name的实际字面量类型T
function baz<T extends Foo>(name: T, values: T extends Foo.A ? number : number[]) {
    // 函数内部的运行时逻辑需要自行判断，TS仅负责校验调用时的参数匹配
    if (name === Foo.A) {
        // 此处TS自动推断values为number类型
    } else {
        // 此处TS自动推断values为number[]类型
    }
}

方式2：函数重载（可读性更强） #

通过拆分重载签名的方式，把不同name取值对应的参数约束单独定义，实现和泛型方案一致的校验效果：

// 重载签名1：匹配name为Foo.A的调用场景
function baz(name: Foo.A, values: number): void
// 重载签名2：匹配name为Foo.B的调用场景
function baz(name: Foo.B, values: number[]): void
// 实现签名：仅TS内部用于校验逻辑，不会出现在代码提示中
function baz(name: Foo, values: number | number[]) {
    // 具体实现逻辑
}

两种方式的实际校验效果完全一致：

• 传入baz(Foo.A, 123) 属于合法调用
• 传入baz(Foo.A, [1,2,3]) 会触发类型报错，提示values应为number
• 传入baz(Foo.B, [1,2,3]) 属于合法调用
• 传入baz(Foo.B, 123) 会触发类型报错，提示values应为number[]

上述两种方案本质都是利用TS的类型收窄能力，把独立的类型定义通过同一个可识别的标识（name的枚举值）绑定，实现“值决定类型”的精准约束，避免用宽泛的联合类型导致的校验漏洞。

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