React+TypeScriptなWebアプリの、(?)ってオプショナルチェーンって言うらしいよ。

オプショナルチェーン(?)って、安全にプロパティを参照できる方法らしいけど、検索性が悪いよね。
"オプショナルチェーン"ね。覚えとくしかない。

まず、undefinedを格納できるメンバを定義する

undefinedを許容する変数を定義するときはこんな感じ

undefined許容

type Point = {
  x: number;               # ← undefinedは格納不可
  y: number;               # ← undefinedは格納不可
  zzz: number | undefined; # ← undefinedを設定できる
  xxx?: number;            # ← undefinedを設定できる
}

使い方はこう

undefined許容

  const aaa : Point = {x:0, y:10, zzz:undefined}
  const bbb : number = 10 + (aaa.zzz ?? 100)
                            ↑括弧つけんと、ビルドエラーになる。優先順位の関係で。
  console.log(bbb)

こんな感じで使える。

Null合体演算子ってものもあるらしい。

上のコードの??の部分ね。aaa.zzzが undefined なら100が返える様になる。

undefined許容

  const aaa : Point = {x:0, y:10, zzz:undefined}
  const bbb : number = 10 + (aaa.zzz ?? 100)
                                     ↑ココ
  console.log(bbb)