【JavaScript ECMAScript】Nullish coalescing operator (??)演算子の使い方

Nullish coalescing operator (??)関数は、左側のオペランド（値）が null または undefined である場合にのみ、右側のオペランド（値）を評価し、その結果を返す処理を実行する演算子です。この演算子は、JavaScriptにおいて、変数が未定義 (undefined) または値がない (null) 状態の際に、安全にデフォルト値を提供したい場面で活用されます。

具体的には、左側の値 ?? 右側の値 という形式で使用され、もし 左側の値 が null または undefined であれば 右側の値 が採用されます。それ以外の場合、つまり 左側の値 が null でも undefined でもない場合は、その 左側の値 がそのまま使用されます。

従来のデフォルト値設定によく使われていた || (論理OR演算子) とは異なる重要な特性を持っています。|| 演算子は、左側の値が 0 や空文字列 ('')、false など、「falsy（偽とみなされる）」な値である場合にも右側の値を返してしまいます。しかし、?? 演算子は null と undefined のみを「値がない」と判断するため、0 や空文字列、false を意図的に有効な値として扱いたい場合に、意図しないデフォルト値の適用を防ぎ、より厳密な挙動を実現します。これにより、コードの信頼性と可読性が向上し、特に変数の初期設定やAPIからのデータ処理などにおいて、安全かつ意図に沿ったデフォルト値の指定が可能になります。

Copy
1const potentiallyNullOrUndefined = null;
2const defaultValue = "デフォルト値";
3const result = potentiallyNullOrUndefined ?? defaultValue;

left, right

• left: Nullish coalescing operator (??) の左辺のオペランド。null または undefined の場合に右辺のオペランドが評価されます。
• right: Nullish coalescing operator (??) の右辺のオペランド。左辺が null または undefined の場合に返されます。

左オペランドの型、または右オペランドの型

Nullish coalescing operator (??) は、左側のオペランドが null または undefined の場合は右側のオペランドを返します。それ以外の場合は左側のオペランドを返します。