「nullかもしれないから、const url = gotUrl || DEFAULT_URLっと」「違うよ」

TypeScriptの||演算子の使い方を勘違いしてました

??と||の違いを理解して使ってるなら問題ないと思います。
自分はわからず使ってた、って話です。

結論

nullかundefinedの場合のみデフォルトの値を設定したければ??を使おう

const url = gotUrl ?? DEFAULT_URL

「 || 」 の何が違うのか？

• ||はORを表している

const url = gotUrl || DEFAULT_URL

つまりこの場合
「gotUrlがnullかundefined」ならDEFAULT_URL、ではない

そうではなく「gotUrlが falsy な値（偽と評価される値）」ならDEFAULT_URL、となる

• falsy な値の例
  • null
  • undefined
  • false
  • ""
  • 0

なので、こんなことも起こる

// x は boolean | null
// x が false の時は flag = false 、x が null の時は flag = true にしたい
const flag = x || true //　しかし flag は常に true

x = false の時は flag = false になって欲しかったが、x || trueの場合、左側が false （falsyな値）だと右側が評価されるので flag = true になる

nullかundefinedの場合のみデフォルトを設定したい場合、??を使おう

const flag = x ?? true // x = false なら flag = false になる

まとめ

nullかundefinedの場合のみデフォルトの値を設定したければ??を使おう（3回目）

const url = gotUrl ?? DEFAULT_URL