連続した Optiona Chain が必要なとき

よく a?.b.c で済むときと a?.b?.c まで書くときがあり混乱する

let x = foo?.bar.baz();

後者だとこれとか

code:ts

const z: { y?: { x?: { w?: {} } } } = {}

z.y?.x?.w // x? がないとだめ

これの違いは nullable の可能性の範囲が違うこと

そもそも ?. とは公式ドキュメントにあるように

let x = foo?.bar.baz(); を let x = foo === null || foo === undefined ? undefined : foo.bar.baz(); と置き換えるような存在

↓ がわかりやすい

code:ts

const z: { y?: { x?: { w?: {} } } } = {}

// ※ hoge == null ⇔ hoge === null || hoge === undefined

z.y?.x.w

// z.y == null

// ? undefined

// : z.y.x.w ← たしかに X が nullable なので警告が出る

z.y?.x?.w

// z.y == null

// ? undefined

// : z.y.x == null

// ? undefined

// : z.y.x.w

つまり↓こういう定義だったら連続してなくてもよい

code:ts

const z: { y?: { x: { w?: {} } } } = {}

z.y?.x.w

// z.y == null

// ? undefined

// : z.y.x.w ← x は存在することが確定しているので