JavaScript switch/case 语句
最后修改于 2025 年 4 月 16 日
在本文中，我们将展示如何使用 switch 和 case 关键字在 JavaScript 中创建条件语句。
switch/case 语句
switch 语句评估一个表达式，并根据匹配的 case 执行代码。 当针对多个可能性测试单个值时，它提供了对冗长的 if-else 链的替代方案。
每个 case 代表 switch 表达式的一个可能匹配项。当找到匹配项时，相应的代码块将执行，直到遇到 break 语句。
当未找到匹配项时，default case 将执行。 虽然是可选的，但包含一个 default case 来处理意外值是一个好习惯。
基本 switch 语句
以下示例演示了 switch 语句的基本结构。
let day = 3;
let dayName;
switch (day) {
case 1:
dayName = 'Monday';
break;
case 2:
dayName = 'Tuesday';
break;
case 3:
dayName = 'Wednesday';
break;
case 4:
dayName = 'Thursday';
break;
case 5:
dayName = 'Friday';
break;
default:
dayName = 'Weekend';
}
console.log(dayName);
此代码将数字日转换为其对应的名称。switch 评估 day 变量并执行匹配的 case。 如果没有 break 语句，则执行将“落入”到后续的 case 中。
$ node main.js Wednesday
Fall-through 行为
JavaScript switch 语句默认表现出 fall-through 行为。
let grade = 'B';
let message;
switch (grade) {
case 'A':
case 'B':
case 'C':
message = 'Passing grade';
break;
case 'D':
message = 'Barely passing';
break;
case 'F':
message = 'Failing grade';
break;
default:
message = 'Unknown grade';
}
console.log(message);
在这里，多个 case 共享相同的代码块。 A、B 和 C 等级都产生相同的消息。这演示了故意的 fall-through，它对于将相关的 case 分组在一起很有用。
$ node main.js Passing grade
严格比较
switch 语句在匹配 case 时使用严格比较 (===)。
let value = '5';
switch (value) {
case 5:
console.log('Number 5');
break;
case '5':
console.log('String "5"');
break;
default:
console.log('Unknown value');
}
此示例显示，字符串 '5' 与数字 5 不匹配，因为严格的类型比较。switch 语句在评估 case 时区分不同的数据类型。
$ node main.js String "5"
在 case 中使用表达式
case 标签可以包含评估为常量值的表达式。
let score = 85;
let grade;
switch (true) {
case score >= 90:
grade = 'A';
break;
case score >= 80:
grade = 'B';
break;
case score >= 70:
grade = 'C';
break;
case score >= 60:
grade = 'D';
break;
default:
grade = 'F';
}
console.log(grade);
该技术通过切换到 true 来在 case 中使用布尔表达式。 评估每个 case，直到找到匹配条件。 对于范围检查，它提供了对复杂 if-else 链的干净替代方案。
$ node main.js B
具有多个条件的 Switch
switch 语句可以在单个 case 中处理多个条件。
let fruit = 'apple';
let color;
switch (fruit) {
case 'apple':
case 'strawberry':
color = 'red';
break;
case 'banana':
case 'lemon':
color = 'yellow';
break;
case 'orange':
color = 'orange';
break;
default:
color = 'unknown';
}
console.log(color);
此示例按颜色对水果进行分组。 多个水果可以共享相同的颜色分配。 switch 语句提供了一种干净的方式来处理这些分组条件，而无需重复代码。
$ node main.js red
Switch vs if-else
与等效的 if-else 链相比，switch 语句通常提供更清晰的代码。
let browser = 'Firefox';
switch (browser) {
case 'Chrome':
case 'Firefox':
case 'Safari':
console.log('Supported browser');
break;
case 'IE':
console.log('Deprecated browser');
break;
default:
console.log('Unknown browser');
}
当检查多个完全匹配项时，switch 版本比一系列 if-else 语句更具可读性。 它以结构化的格式清楚地显示了所有可能的 case 及其相应的操作。
$ node main.js Supported browser
实用示例：命令处理器
这是一个使用 switch 处理不同命令的实用示例。
function processCommand(cmd) {
switch (cmd.toLowerCase()) {
case 'start':
console.log('Starting system...');
break;
case 'stop':
console.log('Stopping system...');
break;
case 'restart':
console.log('Restarting system...');
break;
case 'status':
console.log('System status: OK');
break;
default:
console.log(`Unknown command: ${cmd}`);
}
}
processCommand('START');
processCommand('status');
processCommand('backup');
此命令处理器演示了 switch 如何处理不同的输入命令。 toLowerCase() 确保不区分大小写的匹配。 default case 优雅地处理无效命令。
$ node main.js Starting system... System status: OK Unknown command: backup
来源
在本文中，我们已经演示了如何使用 switch 和 case 关键字在 JavaScript 中创建条件语句。