我有以下代码

interface BaseA {
  a: number;
}

interface SpecialA extends BaseA {
  b: number;
}

type A = BaseA | SpecialA

const a = {
    a: 5, b: 5
} as A

console.log(a.b)

我希望代码是有效的,但我得到了错误

Property 'b' does not exist on type 'A'.
  Property 'b' does not exist on type 'BaseA'

A型似乎不是我想要定义的类型,我希望它与下面的类型等价

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

我的问题是

  1. 为什么我定义的类型A与我期望得到的类型A不同?
  2. 如果不手动定义,我如何定义预期的类型A?

注意:我需要像在某些地方一样使用SpecialA类型,所以不定义它,只定义预期的A不是一个选项.

推荐答案

由于A是一个联合体,您需要narrow/discriminate您的类型才能访问非共享成员.

interface BaseA {
  a: number;
}

interface SpecialA extends BaseA {
  b: number;
}

type A = BaseA | SpecialA

const a = {
  a: 5, b: 5
} as A

if ("b" in a) { // narrowing here
  console.log(a.b)
}

Playground

Typescript相关问答推荐

当两个参数具有相同的通用类型时,如果没有第一个参数,则递减约束默认会导致第二个参数的错误推断

Typescript:假设foo不在类型栏中,而它在:如何调试

如何根据数据类型动态注入组件?

类型安全JSON解析

React router 6.22.3不只是在生产模式下显示,为什么?

泛型函数即使没有提供类型

具有动态键的泛型类型

对数组或REST参数中的多个函数的S参数进行类型判断

当方法参数和返回类型不相互扩展时如何从类型脚本中的子类推断类型

访问继承接口的属性时在html中出错.角形

类型脚本返回的类型包含无意义的泛型类型名称

是否存在类型联合的替代方案,其中包括仅在某些替代方案中存在的可选属性?

错误TS2403:后续变量声明必须具有相同的类型.变量';CRYPTO';的类型必须是';CRYPATO';,但这里的类型是';CRYPATO';

Vue3 Uncaught SyntaxError:每当我重新加载页面时,浏览器控制台中会出现无效或意外的令牌

从对象类型描述生成类型

在TypeScript中扩展重载方法时出现问题

NPM使用Vite Reaction应用程序运行预览有效,但我无法将其部署到Netlify

map 未显示控制台未显示任何错误@reaction-google-map/api

TypeScrip:从嵌套的对象值创建新类型

为什么我会得到一个;并不是所有的代码路径都返回一个值0;switch 中的所有情况何时返回或抛出?(来自vsCode/TypeScript)