Javascript 简明教程

JavaScript - if…​else Statement

当指定的条件为真时，JavaScript if…​else 语句会执行一个代码块。当条件为假时，将执行 else 块。 if-else 语句可用于根据不同的条件控制程序执行流程。

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

JavaScript 支持用于根据不同条件执行不同操作的条件语句。此处我们将解释 if…​else 语句。

Flow Chart of if-else

以下流程图显示了 if-else 语句的工作方式。

decision making

JavaScript 支持以下形式的 if…​else 语句 −

  1. if statement

  2. if…​else statement

  3. if…​else if…​ statement.

JavaScript if statement

if 语句是 JavaScript 中用于做出决定和有条件执行语句的基本控制语句。

Syntax

基本 if 语句的语法如下 −

if (expression) {
   Statement(s) to be executed if expression is true
}

这里计算一个 JavaScript 表达式。如果计算结果为真，则执行给定的语句。如果该表达式为假，则不执行任何语句。在做出决策时，您大多数时候会使用比较运算符。

Example

尝试使用以下示例了解 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>

Output

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

JavaScript if…​else statement

'if…​else' 语句是控制语句的另一种形式，允许 JavaScript 以更受控的方式执行语句。

Syntax

if (expression) {
   Statement(s) to be executed if expression is true
} else {
   Statement(s) to be executed if expression is false
}

在此，会计算 JavaScript 表达式。如果结果值为真，则将执行“if”块中的给定语句。如果表达式的值为假，则将执行 else 块中的给定语句。

Example

尝试运行以下代码，以了解如何在 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>

Output

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

JavaScript if…​else if…​ statement

if…​else if…​ 语句（也称为 if…​else ladder ）是 if…else 的高级形式，它允许 JavaScript 在多种条件的情况下做出正确的决定。

Syntax

if-else-if 语句的语法如下所示：

if (expression 1) {
   Statement(s) to be executed if expression 1 is true
} else if (expression 2) {
   Statement(s) to be executed if expression 2 is true
} else if (expression 3) {
   Statement(s) to be executed if expression 3 is true
} else {
   Statement(s) to be executed if no expression is true
}

此代码别无特别之处。它只是一系列 if 语句，其中每个 if 都是前一条语句的 else 子句的一部分。语句基于真条件执行，如果没有条件为真，则将执行 else 块。

Example

尝试运行以下代码，以了解如何在 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>

Output

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