JavaScript の論理 OR 演算子: どのように機能しますか?

JavaScript の論理 OR (または|| ) 演算子は、左辺がtrueの場合は左辺を返し、それ以外の場合はデフォルトで右辺を返す演算子です。

これは、両方の論理ステートメントをテストするために使用できること、および左側のオペランドがfalsyである場合に右側のオペランドを返すために使用できることを意味します。

それがどのように機能するかを見てみましょう。

JavaScriptで真実と偽りが実際に意味すること

先に進む前に、最初にfalsyの意味を理解しましょう。漠然とした表現のように見えるかもしれませんが、実際には非常に具体的な定義があります。次の値は、JavaScript falsyです。

• false
• 0または-0または0n
• 空any文字列、つまり""
• null
• undefined
• NaN

同様に、 truthyは単にfalsyではないことを意味します。

falsyは0と""を意味する可能性があるため、デフォルト値の設定には不適切な場合があります。

たとえば、一部のシナリオでは、値が実際に0であり、それを表示したい場合、 ||では表示できません。オペレーター。このような場合は、null 結合演算子を検討することをお勧めします。

論理 OR 演算子は JavaScript でどのように機能しますか?

前述のように、 || operator には、JavaScript の 2 つの主要な機能があります。最も一般的には、論理if..elseステートメントで見つかります。 truthyでは、オペランドの 1 つ以上が true の場合に true を返しますが、 true の場合は最初の値を返すためにも使用されtruthy 。または、右側にデフォルトが設定されます。そうでない場合はオペランド。

||実際に値を返すため、これらの両方の方法で機能します。

ロジックでの論理 OR の使用

|| 見たことがあるでしょう|| ifやelseなどの論理ステートメントで最も一般的に使用されます。これらの場合、通常は論理ステートメントをテストしているので、 ||オペランドの 1 つ以上がtruthyの場合、 trueを返します。

以下で起こっているのは||です。演算子は値を返し、 ifステートメントはそれをtrueまたはfalseに変換します

let x = 100; // This returns true, since both of these statements are correct. if(x > 5 || x > 10) { // ... } // Since both "1" and "2" can be converted to true, this also returns true in this context. if("1" || "2") { // ... } // Since both "" and null are falsy, they are converted to false, and as such this returns false. if("" || null) { // ... }

これは||を使用する主な方法の 1 つです。コード内で使用されますが、 truthyの程度に基づいて値をfalsyためにもよく使用されます。

戻り値

論理ステートメント以外の別の例を見てみましょう。前述のとおり、 || truthyの場合は左辺を返しますが、それ以外の場合は右辺を返します。

少しややこしいので、いくつか例を見てみましょう。

 // Is set to 1, since the first operand is falsy let x = false || 1; // Is set to hello, since "hello" is truthy let y = "hello" || true;

上記の例では、 xの左辺がfalseに設定されているため、 xは 1 になります。同様に、 y "hello"はfalsyではないため、 yの値は"hello"になります。この機能は、論理ステートメントやif..elseステートメントでのアプリケーションとは異なりますが、多くの状況で役立ちます。

興味深いことに、最後に指定された項目がfalsyであっても、JavaScript はそれを返します。

例えば：

 // Is set to null since false is falsy let x = false || null; // Is set to false since 0 is falsy let y = 0 || false;

OR 演算子の連鎖

||をチェーンすることができます。 JavaScript の演算子。論理ステートメントを (if. if..else句で) チェーンする場合、チェーンされた項目がtruthyの場合、ステートメントは true を返します。

 // This works since both "1" and true are truthy if("1" || true || false) { // ... console.log('this works') } // This doesn't work since all values are falsy if(false || null || undefined) { console.log('this does not work'); }

||を使用する場合論理ステートメントの外側にチェーンされている場合、最初に見つかったtruthyの値を使用するか、デフォルトで最終値を使用します。たとえば、以下では、 xは3に等しく、 yはtrue 、 zは{}です。なぜzが{}なのか疑問に思っているなら、それはfalsyでないものはtruthyであるからです。つまり、オブジェクトがtruthyであることを意味します!

 // x is set to 3 let x = false || 0 || 3; // y is set to true let y = false || true || 3; // z is set to {} let z = {} || [] || x;

結論

||演算子は、論理ステートメントで頻繁に使用されます。また、 falsyでない値が見つかった場合は、その値にデフォルト設定されます。これは、JavaScript を理解するためのコアとなる柔軟な演算子です。別の同様の演算子に興味がある場合は、ヌル合体演算子についても読みたいと思うかもしれません。