Null合体演算子 (??)と論理和演算子 (||)

Null合体演算子とは

?? はNull合体演算子と呼ばれ、左側の値が null または undefined の場合に右側の値を返します。それ以外の場合は左側の値を返します。

const name = null;
const defaultName = 'Guest';

console.log(name ?? defaultName); // 'Guest'

const age = 0;
const defaultAge = 18;

console.log(age ?? defaultAge); // 0 (ageはnullでもundefinedでもないため)

論理和演算子とは

|| は論理和演算子と呼ばれ、左側の値が「偽」と評価される場合に右側の値を返します。「偽」と評価される値には、以下のものがあります

false
0
'' (空文字列)
null
undefined
NaN (Not a Number)

const name = '';
const defaultName = 'Guest';

console.log(name || defaultName); // 'Guest' (空文字列は「偽」と評価されるため)

Null合体演算子と論理和の違い

Null合体演算子(??)
左側の値が null または undefined の場合に右側の値を返します。
それ以外の場合は左側の値を返します。

論理和演算子(||)
左側の値が「偽」と評価される場合に右側の値を返します。
「偽」と評価される値には、false, 0, '', null, undefined, NaN があります。

const name = '';
const defaultName = 'Guest';

console.log(name || defaultName); // 'Guest' (空文字列は「偽」と評価されるため)
console.log(name ?? defaultName); // '' (空文字列は `null` でも `undefined` でもないため)

const count = 0;
const defaultCount = 10;

console.log(count || defaultCount); // 10 (0は「偽」と評価されるため)
console.log(count ?? defaultCount); // 0 (0は `null` でも `undefined` でもないため)

const value = null;
const defaultValue = 'default';

console.log(value || defaultValue); // 'default' (nullは「偽」と評価されるため)
console.log(value ?? defaultValue); // 'default' (nullは `null` であるため)