JavaScript - if...else 语句

JavaScript if...else 语句在指定条件成立时执行一段代码块。当条件不成立时，将执行 else 代码块。if-else 语句可用于根据不同条件控制程序的执行流程。

在编写程序时，可能会遇到需要从一组给定路径中选择一条的情况。在这种情况下，您需要使用条件语句，以使程序做出正确的决策并执行正确的操作。

JavaScript 支持条件语句，用于根据不同条件执行不同的操作。这里我们将解释 if...else 语句。

if-else 流程图

以下流程图展示了 if-else 语句的工作原理。

JavaScript 支持以下形式的 if...else 语句 -

• if 语句

• if...else 语句

• if...else if... 语句。

JavaScript if 语句

if 语句是 JavaScript 的基本控制语句，它允许 JavaScript 进行决策并有条件地执行语句。

语法

基本 if 语句的语法如下−

if (表达式) {
    表达式为真时执行的语句
}

此处对 JavaScript 表达式进行求值。如果结果为真，则执行给定的语句。如果表达式为假，则所有语句均不会执行。大多数情况下，在进行判断时都会使用比较运算符。

示例

尝试以下示例来了解 if 语句的工作原理。

<html>
<body>     
   <div id ='output'> </div>
   <script type = "text/javascript">
      let result;
      let age = 20;
      if( age > 18 ) {
         result = "Qualifies for driving";
      }
	  document.getElementById("output").innerHTML = result;
   </script>      
<p> Set the variable to a different value and then try... </p>
</body>
</html>

输出

Qualifies for driving
Set the variable to different value and then try...

JavaScript if...else 语句

'if...else' 语句是另一种控制语句，它允许 JavaScript 以更可控的方式执行语句。

语法

if (表达式) {
    表达式为真时执行的语句
} else {
    表达式为假时执行的语句
}

此处对 JavaScript 表达式进行求值。如果结果为真，则执行 if 块中指定的语句。如果表达式为假，则执行 else 块中指定的语句。

示例

尝试以下代码，了解如何在 JavaScript 中实现 if-else 语句。

<html>
<body>
   <div id ='output'> </div>
   <script type = "text/javascript">
	  let result;
      let age = 15;
      if( age > 18 ) {
         result = "Qualifies for driving";
      } else {
         result = "Does not qualify for driving";
      }
      document.getElementById("output").innerHTML = result;
   </script>     
   <p> Set the variable to a different value and then try... </p>
</body>
</html>

输出

Does not qualify for driving
Set the variable to different value and then try...

JavaScript if...else if... 语句

if...else if... 语句(也称为 if...else 阶梯)是 ifelse 的高级形式，允许 JavaScript 根据多个条件做出正确的判断。

语法

if-else-if 语句的语法如下:-

if (表达式 1) {
    如果表达式 1 为真，则执行的语句
} else if (表达式 2) {
    如果表达式 2 为真，则执行的语句
} else if (表达式 3) {
    如果表达式 3 为真，则执行的语句
} else {
    如果所有表达式都不为真，则执行的语句
}

这段代码没有什么特别之处。它只是一系列 if 语句，其中每个 if 都是前一个语句的 else 子句的一部分。语句根据条件是否成立执行，如果所有条件都不成立，则执行 else 块。

示例

尝试以下代码，了解如何在 JavaScript 中实现 if-else-if 语句。

<html>
<body>
   <div id ="demo"></div>
   <script type="text/javascript">
	  const output = document.getElementById("demo")
      let book = "maths";
      if (book == "history") {
         output.innerHTML="<b>History Book</b>";
      } else if (book == "maths") {
         output.innerHTML="<b>Maths Book</b>";
      } else if (book == "economics") {
         output.innerHTML="<b>Economics Book</b>";
      } else {
         output.innerHTML="<b>Unknown Book</b>";
      }
    </script>
    <p> Set the variable to a different value and then try... </p>
</body>
<html>

输出

Maths Book
Set the variable to different value and then try...