在 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 次浏览

启动您的职业生涯

完成课程获得认证

开始学习
广告