如何在TypeScript中收窄对象的单个属性类型？

问题场景代码 #

type Foo = { 
  a: number | undefined
  b: string
}

let foo: Foo 
foo = { 
  a: 1,
  b: 'b'
}

// 仅接受Foo的收窄版本的函数
const fn = (arg: Foo & { a: number }) => console.log(arg.a)

if(foo.a !== undefined){
  // 编译器应识别foo类型已收窄为{a: number, b: string}，但实际无法通过校验
  fn(foo) // 此处类型校验报错
}

问题说明 #

判断foo.a !== undefined后，TypeScript并未正确将整个foo的类型收窄为Foo & { a: number }，导致调用fn时无法通过类型校验。虽然可以通过fn(foo as Foo & { a: number })的类型断言临时解决，但存在更优的方案。

优化解决方法 #

• 自定义类型守卫函数：通过明确的类型守卫逻辑，让编译器准确识别对象的收窄类型，兼顾可读性与类型安全性：

  function isFooWithDefinedA(foo: Foo): foo is Foo & { a: number } {
    return foo.a !== undefined;
  }
  
  if (isFooWithDefinedA(foo)) {
    fn(foo); // 类型校验正常通过
  }
  

• 解构赋值重构对象：将对象属性解构后，利用单个属性的类型收窄结果，重构出符合要求的对象，无需额外断言：

  const { a, b } = foo;
  if (a !== undefined) {
    fn({ a, b }); // 编译器自动推断此对象类型为Foo & { a: number }
  }
  

• 简化类型断言：若仍需使用断言，可采用更简洁的写法减少代码冗余：

  if (foo.a !== undefined) {
    fn(foo as typeof foo & { a: number });
  }
  

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