在 JavaScript 的 var 語句中，運算子 || 是做什麼的？

在本教程中，我們將討論在 JavaScript 的 var 語句中運算子 || 的作用。

邏輯或運算子或邏輯析取運算子對運算元進行運算，如果任何運算元的值為真，則返回真；假、""、null、undefined、0 和 NaN 為假值。所有其他值為真。

邏輯或運算元必須是布林值、整數或指標型別。如果不存在真值，則邏輯或運算子返回最後一個運算元。邏輯或運算子從左到右執行。

使用者可以按照以下語法使用邏輯或運算子。

語法

expr1 || expr2

上述語法包含兩個使用邏輯或運算的表示式。如果 expr1 或 expr2 為真，則整個表示式為真。

在一般語句中使用 || 運算子

示例

在這個示例中，我們使用了帶有邏輯或運算子的各種表示式。運算子透過從左到右執行返回輸出。

<html>
<head>
   <script type = "text/javascript">
      function logicalOrStatements()
      {
         var logicOrStmtBtn = document.getElementById("logicOrStmtBtnWrap");
         var logicOrStmtOut = document.getElementById("logicOrStmtOut");
         var logicOrStmtStr = "";
         var variable = "variable";
         var logicOrCbk = function(inp)
         {
            logicOrStmtStr += " <b>"+ inp + "</b></br></br>";
         };
         logicOrStmtStr += 'true || true';
         logicOrCbk(true || true);
         
         logicOrStmtStr += 'false || true';
         logicOrCbk(false || true);
         
         logicOrStmtStr += 'true || false';
         logicOrCbk(true || false);
         
         logicOrStmtStr += '(false || (3 === 4))';
         logicOrCbk(false || (3 === 4));
         
         logicOrStmtStr += "('One' || 'Two')";
         logicOrCbk('One' || 'Two');
         
         logicOrStmtStr += "(false || 'One')";
         logicOrCbk(false || 'One');
         
         logicOrStmtStr += "('One' || false)";
         logicOrCbk('One' || false);
         
         logicOrStmtStr += "('' || false)";
         logicOrCbk('' || false);
         
         logicOrStmtStr += "(false || '')";
         logicOrCbk(false || '');
         
         logicOrStmtStr += '(false || variable)';
         logicOrCbk(false || variable);
         
         const a = 30;
         const b = -2;
         console.log(a > 0 || b > 0);
         logicOrStmtStr += 'a=30, b=-2 (a > 0 || b > 0)';
         logicOrCbk((a > 0 || b > 0));
         
         logicOrStmtOut.innerHTML = logicOrStmtStr;
      }
   </script>
</head>
<body>
   <h2> Working of the logical OR || operator in statements </h2>
   <div id = "logicOrStmtBtnWrap">
      <p> Click the button </p>
      <button onclick = "logicalOrStatements()"> Click Me </button>
   </div>
   <div id = "logicOrStmtOut"> </div>
</body>
</html>

在物件中使用 || 運算子

我們還可以使用邏輯或運算子在某些物件不可用時獲取預設值。

示例

這裡，people 物件具有 name 屬性。所以它返回 'Egan'。people 物件沒有 age 屬性。所以它返回 'Nil'。

<html>
<head>
   <script type = "text/javascript">
      function logicalOrStatements()
      {
         var logicOrObjBtn = document.getElementById("logicOrObjBtnWrap");
         var logicOrObjOut = document.getElementById("logicOrObjOut");
         var logicOrPre = document.getElementById("logicOrPre");
         var logicOrObjStr = "";
         var variable = "variable";
         var logicOrCbk = function(inp)
         {
            logicOrObjStr += " <b>"+ inp + "</b></br></br>";
         };
         var people =
         {
            name: 'Egan'
         };
            logicOrPre.innerHTML = JSON.stringify(people);
            logicOrObjStr += ("people.name || 'Nil'");//Egan
            logicOrCbk(people.name || 'Nil');
            
            logicOrObjStr += ("people.age || 'Nil'");//Nil
            logicOrCbk(people.age || 'Nil');
            logicOrObjOut.innerHTML = logicOrObjStr;
         }
      </script>
   </head>
<body>
   <h2>Working of the logical OR || operator in objects </h2>
   <pre id = "logicOrPre"></pre>
   <div id = "logicOrObjBtnWrap">
      <p>Click the button</p>
      <button onclick = "logicalOrStatements()"> Click Me </button>
   </div>
   <div id = "logicOrObjOut">
</body>

在函式中使用 || 運算子

這裡我們在函式呼叫中使用邏輯或運算子。

示例

在這個示例中，我們首先呼叫函式 Y。所以輸出是首先執行函式 Y。執行在此停止，因為邏輯或運算子從左到右執行。

<html>
<head>
   <script type="text/javascript">
      function logicalOrStatements()
      {
         var logicOrFnBtn = document.getElementById("logicOrFnBtnWrap");
         var logicOrFnOut = document.getElementById("logicOrFnOut");
         var logicOrPre = document.getElementById("logicOrPre");
         var logicOrFnStr = "";
         var variable = "variable";
         function X()
         {
            logicOrFnStr += 'function X';
            return false;
         }
         function Y()
         {
            logicOrFnStr += 'function Y';
            return true;
         }
         var output = (Y() || X());
         logicOrFnOut.innerHTML = "(Y() || X())" + "<br><br><b>"+ logicOrFnStr + "</b><br><b>" + output + "</b>";
      }
   </script>
</head>
<body>
   <h2>Working of the logical OR || operator in function calls</h2>
   <div id = "logicOrFnBtnWrap">
      <p> Click the button </p>
      <button onclick = "logicalOrStatements()"> Click Me </button>
   </div>
   <div id = "logicOrFnOut"> </div>
</body>
</html>

在本教程中，我們討論了邏輯或運算子在 JavaScript 的 var 語句中的用途。我們已經透過不同的示例來更好地理解這一點。當我們需要首先執行滿足真條件的程式碼塊時，邏輯運算子很有用。

更新於：2022年10月31日

161 次瀏覽

啟動您的職業生涯

完成課程獲得認證

開始學習
廣告
© . All rights reserved.