嵌套解构可能未定义 object

Question

My auto generated query types look something like this

export type MatchLivePlayerType = {
  __typename?: 'MatchLivePlayerType';
  playbackData?: Maybe<MatchPlayerLivePlaybackDataType>;
};

export type MatchPlayerLivePlaybackDataType = {
  __typename?: 'MatchPlayerLivePlaybackDataType';
  positionEvents?: Maybe<Array<Maybe<MatchLivePlayerPositionDetailType>>>;
};

export type MatchLivePlayerPositionDetailType = {
  __typename?: 'MatchLivePlayerPositionDetailType';
  time: Scalars['Int'];
  x: Scalars['Int'];
  y: Scalars['Int'];
};

For a data result like the following

{
  "heroId": 93,
  "playbackData": {
    "positionEvents": [
      {
        "y": 85,
        "x": 173,
        "time": 31
      }
    ]
  }
}

When attempting to do nested destructuring I'm unable to find a valid way to correctly get positonEvents with a default fallback without getting a TS error for

Property 'positionEvents' does not exist on type 'Maybe<MatchPlayerLivePlaybackDataType>'

const defaultPositionEvents = {
  positionEvents: [
    {
      y: 0,
      x: 0,
      time: 0
    }
  ]
}
const { heroId, isRadiant, playbackData: { positionEvents } = defaultPositionEvents as MatchPlayerLivePlaybackDataType } = player;

Answer 1

You can't destructure a nested object that might be undefined or null

type Foo = {
    bar?: Bar
}

type Bar = {
    baz?: string
}

declare const foo: Foo;

const { bar: { baz } } = foo; // KO 

if (foo.bar) {
    const { bar: { baz } } = foo; // OK
}

Narrowing fixes the problem.