JavaScript中switch语句的用法详解
本文详解JavaScript中switch语句的语法结构，重点解析break语句在控制执行流程中的作用。通过对比有break和无break两种情况下的代码输出结果，说明省略break时发生的case穿透现象，帮助开发者正确掌握switch语句的使用技巧。
switch语句引入
在前面的章节中，我们曾介绍过可以使用多个if...else if语句来执行多路分支逻辑。然而，这种写法并不总是最佳解决方案，特别是当所有分支逻辑都依赖于同一个变量的值时。
switch语句语法
自JavaScript 1.2版本起，引入了switch语句来处理此类情况。相比于反复使用if...else if语句，switch语句在此类场景下执行效率更高。
switch语句的基本语法是：提供一个expression（表达式）进行求值，解释器会根据该表达式的值，执行几种不同的语句。解释器会逐一检查expression的值是否匹配各个case条件，直到找到第一个匹配项。如果没有找到任何匹配项，则执行default（默认）条件下的语句。
switch (expression)
{
case condition 1: statement(s)
break;
case condition 2: statement(s)
break;
...
case condition n: statement(s)
break;
default: statement(s)
}
break语句的作用
break语句的作用是指示解释器在特定case条件执行完毕后结束switch语句。如果省略了break语句，解释器将继续执行后续每一个case中的语句，直到遇到break或switch语句结束。
关于break语句在循环控制中的具体应用，我们将在后续的循环控制章节中进行详细解释。
switch语句示例
以下示例展示了一个基本的switch语句用法：
<script type="text/javascript">
<!--
var grade='A';
document.write("Entering switch block<br />");
switch (grade)
{
case 'A': document.write("Good job<br />");
break;
case 'B': document.write("Pretty good<br />");
break;
case 'C': document.write("Passed<br />");
break;
case 'D': document.write("Not so good<br />");
break;
case 'F': document.write("Failed<br />");
break;
default: document.write("Unknown grade<br />")
}
document.write("Exiting switch block");
//-->
</script>
该示例代码将产生以下输出结果：
Entering switch block
Good job
Exiting switch block
无break语句的执行流程
接下来，我们考虑另一种情况：如果不使用break语句会怎样？
该示例代码将产生以下输出结果：
<script type="text/javascript">
<!--
var grade='A';
document.write("Entering switch block<br />");
switch (grade)
{
case 'A': document.write("Good job<br />");
case 'B': document.write("Pretty good<br />");
case 'C': document.write("Passed<br />");
case 'D': document.write("Not so good<br />");
case 'F': document.write("Failed<br />");
default: document.write("Unknown grade<br />")
}
document.write("Exiting switch block");
//-->
</script>
这将产生以下结果：
Entering switch block
Good job
Pretty good
Passed
Not so good
Failed
Unknown grade
Exiting switch block
JavaScript异步发送HTTP请求时怎么优雅地处理错误
2026-11-05 17:10:44
5款主流JS在线运行工具对比：CodePen、JSFiddle与StackBlitz怎么选
2026-11-05 17:04:04
JavaScript入门书籍避坑：这些书不适合初学者
2026-11-05 16:31:15
JS使用Math.round实现保留两位小数的原理与代码
2026-11-05 15:35:55
JavaScript 原生 Date 对象怎么实现日期加减
2026-11-05 14:30:00