TypeScript访问联合类型非共有属性报错的纯TS解决方案及原理

以下方案均不会修改原有JavaScript运行逻辑，仅调整类型定义即可消除报错：

• 补充接口可选属性（推荐）
  直接在interface A中增加可选的b属性声明，明确告知TypeScript该属性可能在A类型的实例上存在，值为number或undefined：

  interface A {
      a: number;
      b?: number;
  }
  

  补充后A | B联合类型会自动携带可选属性b，直接访问arg.b不会触发校验错误，且?? 42的兜底逻辑和类型推导结果完全匹配。
• 局部调整函数参数类型（不改动全局接口）
  如果不想修改全局的A接口定义，可以在函数参数的类型定义上交叉补充可选的b属性，规则仅对当前函数生效：

  const myFunct = (arg: (A | B) & { b?: number }) => {
      // 原有JS代码完全保留，无任何运行时改动
      const myNumber = arg.b ?? 42;
      console.log(myNumber);
  };
  

• 单行跳过校验（不推荐）
  临时绕过检查可在报错行上方添加TS忽略注释，注释不会出现在最终运行的JS代码中：

  // @ts-ignore
  const myNumber = arg.b ?? 42;
  

  该方式会跳过当前行的所有类型检查，可能掩盖属性名拼写错误等真实问题，非必要不使用。

注意：目前TypeScript没有提供可全局关闭「联合类型仅允许访问共有成员属性」规则的tsconfig配置项，上述方案均为类型层面的调整，编译后不会产生任何额外的JS代码。

arg.b ?? 42报错的原因 #

TypeScript对联合类型的属性访问遵循最小权限安全规则：只有当一个属性在联合类型的所有成员上都有明确声明时，才允许直接访问。这个设计的核心目的是在静态检查阶段拦截属性名拼写错误、误访问不存在属性的低级问题。
在A | B联合类型中，b属性仅在接口B中存在声明，接口A的定义中完全没有b的相关描述。TypeScript会默认：被标记为A类型的值，不应该存在b属性，直接访问属于非法操作——哪怕JavaScript运行时访问不存在的属性只会返回undefined，静态检查阶段依然会抛出错误。

"b" in arg ? arg.b : 42不报错的原因 #

该写法触发了TypeScript的*类型收窄（Type Narrowing）*机制：in操作符是TypeScript内置的类型守卫，当代码执行到"b" in arg的判断分支时，TS会自动将该分支内的arg类型收窄为B（只有B类型明确声明了b属性），这个分支下访问arg.b完全符合类型要求；在判断不成立的else分支中，TS会将arg收窄为A类型，该分支内没有访问b属性，自然不会触发报错。

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