1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

JavaScript: Logical OR (||) と Nullish Coalescing (??) の違い

Posted at

JavaScriptには||(論理OR)と??(Nullish Coalescing)という2つの演算子があります。

これらはどちらも値がnullまたはundefinedのときにデフォルト値を設定するために使用されますが、その挙動には重要な違いがあります。

論理OR (||)

return params || "";

||演算子は左辺の値がfalsy(評価時に偽となる値)の場合に右側の値を返します。JavaScriptでは以下の値は falsyと評価されます。

false
0 や -0
""(空文字列)
null
undefined
NaN

このため、params変数がnullundefinedだけでなく、その他のfalsyな値(例えば空文字列や0)の場合にも右辺のデフォルト値(この場合は空文字列"")が返されます。

Nullish Coalescing (??)

return params ?? "";

??演算子はnullまたはundefinedの場合に右辺の値を返します。

この演算子は、nullundefinedの値を確認する特別な場合に使用され、他のfalsyな値(例えばfalse0"")では右辺には移動しません。

これは、特にfalse0などの値が有効な値として意図されている場合に便利です。
値が本当にnullundefinedかを確認したいときに役立ちます。

まとめ

||演算子は、左辺の値がfalsy(偽となる値)の場合に右辺の値を返します。

??演算子は、左辺の値がnullまたはundefinedのときのみに右辺の値を返します。

常にどの値が予期されるか、どの値をデフォルトとして設定したいかを考慮することが重要です。

これにより、コードは予期しないバグから保護され、読みやすく保守しやすくなります。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?