JavaScript条件判断语句详解：if、else与嵌套逻辑
本文详细介绍JavaScript中的条件判断语句，包括基础的if语句、if...else分支结构以及if...else if...多分支逻辑。通过具体代码示例解析表达式求值、真假判断及语句执行流程，帮助开发者掌握程序决策的核心控制机制。
JavaScript条件判断概述
在编写程序时，常会遇到需要从多个路径中选择其一的情况。此时需要借助条件语句，让程序根据特定规则做出正确决策并执行相应操作。
JavaScript提供了用于根据条件执行不同操作的控制语句。本文将重点讲解if...else语句的具体用法。
JavaScript中if...else语句的基本形式如下所示：
- if 语句
- if...else 语句
- if...else if... 语句
if 语句基础用法
if 语句详解
if语句是JavaScript中最基础的控制语句，用于根据条件决定是否执行特定代码块。语法结构如下：
if (expression){
Statement(s) to be executed if expression is true
}
上述代码中，JavaScript会先对expression表达式进行求值。若结果为true，则执行if块内的语句；若为false，则跳过该语句块。在决策场景中，通常会使用比较运算符来构建表达式。示例代码如下：
<script type="text/javascript">
<!--
var age = 20;
if( age > 18 ){
document.write("<b>Qualifies for driving</b>");
}
//-->
</script>
运行上述代码将产生以下输出结果：
Qualifies for driving
if...else 分支结构
if...else 语句详解
if...else语句是控制语句的另一种形式，允许JavaScript执行更精细的条件分支控制。其语法结构如下：
if (expression){
Statement(s) to be executed if expression is true
}else{
Statement(s) to be executed if expression is false
}
代码逻辑中，JavaScript首先对表达式进行求值。若结果为true，则执行if块内的语句；若结果为false，则执行else块内的语句。示例代码如下：
<script type="text/javascript">
<!--
var age = 15;
if( age > 18 ){
document.write("<b>Qualifies for driving</b>");
}else{
document.write("<b>Does not qualify for driving</b>");
}
//-->
</script>
运行上述代码将产生以下输出结果：
Does not qualify for driving
if...else if... 多分支逻辑
if...else if... 语法结构
if...else if...语句是对控制语句的进一步扩展，允许JavaScript在多个条件中做出正确决策。其语法结构如下：
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子句中。程序会按顺序判断条件，若某个条件为true则执行对应语句；若所有条件均不满足，则执行最后的else块。示例代码如下：
<script type="text/javascript">
<!--
var book = "maths";
if( book == "history" ){
document.write("<b>History Book</b>");
}else if( book == "maths" ){
document.write("<b>Maths Book</b>");
}else if( book == "economics" ){
document.write("<b>Economics Book</b>");
}else{
document.write("<b>Unknown Book</b>");
}
//-->
</script>
运行上述代码将产生以下输出结果：
Maths Book
什么时候该用JS构造器：与工厂模式、字面量的选择对比
2026-11-05 16:18:22
推荐几款轻量级JS照片墙开源库及对比
2026-11-05 15:56:19
JavaScript递归写法有哪些常见陷阱及避免方法
2026-11-05 14:53:38
JS数组浅拷贝与深拷贝怎么选？场景与方法总结
2026-11-05 14:41:02
p5.js 中 setup() 和 draw() 函数的执行机制详解
2026-11-05 12:32:38