TypeScript联合类型下同名属性的类型推断问题

我定义了联合类型C为A | B，在类test中声明了类型为C的变量thisIsC。当给该变量赋值返回B类型的getTypeB()结果时，若A和B存在同名属性prop1，TypeScript无法将thisIsC推断为B类型；但无同名属性时推断正常。目前我可通过辅助变量或类型断言解决，但想了解是否有方法优化内部类型推断逻辑。

存在同名属性的示例代码 #

class A {
    prop1: string;
}

class B {
    prop1: string;
    prop2: string;
}

type C = A | B;

class test {
    thisIsC: C;

    constructor() {
        this.thisIsC = this.getTypeB(); // 无法推断为B类型
        const b = this.getTypeB(); // 推断正常
        const a = this.thisIsC;
    }

    getTypeB(): B {
        return new B();
    }
}

无同名属性的示例代码 #

class A {
    prop1: string;
}

class B {
    prop2: string;
    prop3: string;
}

type C = A | B;

class test {
    thisIsC: C;

    constructor() {
        this.thisIsC = this.getTypeB(); // 可推断为B类型
        const a = this.thisIsC;
    }

    getTypeB(): B {
        return new B();
    }
}

原因分析 #

TypeScript在处理类实例的联合类型时，若两个类型存在完全相同的属性（名称和类型均一致），赋值后不会自动将类成员变量的类型从联合类型收窄到具体子类型——因为类成员变量是可重新赋值的，TypeScript会保留其声明的联合类型，防止后续被赋值为另一个子类型时出现类型错误。而当两个类型没有共同属性时，B的独特属性可作为类型标识，让TypeScript确定当前thisIsC的类型为B。

优化类型推断的方法 #

• 使用instanceof类型守卫：在需要访问B的独有属性时，通过类型判断收窄类型：

  if (this.thisIsC instanceof B) {
      console.log(this.thisIsC.prop2); // 此处thisIsC被推断为B类型
  }
  

• 调整类型定义，给共同属性设置区分度：如果业务允许，让A和B的同名属性类型不同，比如：

  class A {
      prop1: 'A'; // 改为字面量类型
  }
  
  class B {
      prop1: 'B';
      prop2: string;
  }
  

  这样TypeScript可以通过prop1的值自动收窄类型。
• 使用断言明确类型：如果能确保thisIsC后续不会被赋值为A，可以直接用类型断言，但需注意类型安全：

  this.thisIsC = this.getTypeB() as B;
  

• 利用辅助变量间接赋值：就像示例中const b = this.getTypeB();，辅助变量会被推断为B类型，后续使用时可以基于该变量操作，避免直接依赖类成员变量的类型。

内容的提问来源于stack exchange，提问作者Alex Albalá