如何在 JavaScript 中使用 Switch 语句

介绍

条件声明是所有编程语言中最有用的和最常见的功能之一。 How To Write Conditional Statements in JavaScript描述了如何使用如果,elseelse如果关键字来控制一个程序的流程,基于不同的条件,在JavaScript中通常是用户输入的结果。

除了如果...else之外,JavaScript还具有一个称为交换声明的功能。switch是一种类型的条件声明,它将对多个可能情况进行评估,并根据匹配情况执行一个或多个代码块。

在本教程中,我们将学习如何使用交换机陈述,以及如何使用相关的关键字案例,默认 最后,我们将讨论如何在交换机陈述中使用多个案例。

交换

交换语句评估一个表达式并执行代码作为一个匹配案例的结果. 基本语法类似于一个如果语句. 它将总是用交换( { } )写,包含包含要测试的表达式的和包含潜在代码的弯曲的。

下面是两个案例陈述和一个被称为默认的倒退的交换陈述的示例。

 1switch (expression) {
 2    case x:
 3    	// execute case x code block
 4    	break;
 5    case y:
 6    	// execute case y code block
 7    	break;
 8    default:
 9    	// execute default code block
10}

按照上面的代码块的逻辑,这是会发生的事件序列:

  • 表达式被评估.
  • 第一个案例,x,将被测试对比表达式. 如果它匹配,代码将执行,而关键字将结束交换机块。
  • 如果它不匹配,则x将被跳过,而y案例将被测试对比表达式。 如果y匹配表达式,代码将执行并离开交换机块。

在这个代码块中,我们将使用新日期()方法找到当前的周日,并使用getDay()来打印与当前日期的数字。

1const day = new Date().getDay();

该程序将从顶部到底部运行,寻找匹配,一旦找到一个,‘break’命令将阻止‘switch’块继续评估陈述。

 1[label week.js]
 2// Set the current day of the week to a variable, with 0 being Sunday and 6 being Saturday
 3const day = new Date().getDay();
 4
 5switch (day) {
 6    case 0:
 7    	console.log("It's Sunday, time to relax!");
 8    	break;
 9    case 1:
10    	console.log("Happy Monday!");
11    	break;
12    case 2:
13    	console.log("It's Tuesday. You got this!");
14    	break;
15    case 3:
16    	console.log("Hump day already!");
17    	break;
18    case 4:
19    	console.log("Just one more day 'til the weekend!");
20    	break;
21    case 5:
22    	console.log("Happy Friday!");
23    	break;
24    case 6:
25    	console.log("Have a wonderful Saturday!");
26    	break;
27    default:
28    	console.log("Something went horribly wrong...");
29}
1[secondary_label Output]
2'Just one more day 'til the weekend!'

这个代码是在星期四测试的,这相当于4,因此控制台的输出是只有一天到周末! 根据你正在测试代码的周日,你的输出将是不同的。

如果我们在每个陈述中忽略了的关键字,其他案例的陈述都不会被评估为真,但程序会继续检查,直到它达到终点。

交换级别

在某种情况下,您可能需要在一个交换机块中评估一个值范围,而不是一个单个值,如上面的示例中所示。

条件声明教程中,我们创建了一个评级应用程序,该应用程序将采取数字分数并将其转换为字母分数,具有以下要求。

  • 90 级以上为 A
  • 80 级至 89 级为 B
  • 70 级至 79 级为 C
  • 60 级至 69 级为 D
  • 59 级或以下为 F

由于我们正在检查一个范围,我们将在每个案例中执行操作,以检查每个表达式是否被评估为,然后在满足的要求后退出声明。

 1[label grades.js]
 2// Set the student's grade
 3const grade = 87;
 4
 5switch (true) {
 6    // If score is 90 or greater
 7    case grade >= 90:
 8    	console.log("A");
 9    	break;
10    // If score is 80 or greater
11    case grade >= 80:
12    	console.log("B");
13    	break;
14    // If score is 70 or greater
15    case grade >= 70:
16    	console.log("C");
17    	break;
18    // If score is 60 or greater
19    case grade >= 60:
20    	console.log("D");
21    	break;
22    // Anything 59 or below is failing
23    default:
24    	console.log("F");
25}
1[secondary_label Output]
2'B'

在此示例中,要评估的关节中的表达式是true,这意味着任何评估为true案例都将是一个匹配。

else if一样,switch从顶部到底部进行评估,并接受第一个真正的匹配,因此,即使我们的级别变量是87,因此对C和D也被评估为真实,第一个匹配是B,这将是输出。

多案例

您可能会遇到代码,其中多个案例应该具有相同的输出. 为了做到这一点,您可以为每个代码块使用多个案例

首先,我们将使用新日期()方法找到与当前月份相符的数字,并将其应用于变量。

1const month = new Date().getMonth();

新日期().getMonth()方法将输出从011的数字,其中0为1月和11为12月。

我们的应用程序将输出四个季节,以便简化以下规格:

  • 冬季:一月、二月和三月
  • 春季:四月、五月和六月
  • 夏季:七月、八月和九月
  • 秋季:十月、十一月和十二月

下面是我们的代码。

 1[label seasons.js]
 2
 3// Get number corresponding to the current month, with 0 being January and 11 being December
 4const month = new Date().getMonth();
 5
 6switch (month) {
 7    // January, February, March
 8    case 0:
 9    case 1:
10    case 2:
11    	console.log("Winter");
12    	break;
13    // April, May, June
14    case 3:
15    case 4:
16    case 5:
17    	console.log("Spring");
18    	break;
19    // July, August, September
20    case 6:
21    case 7:
22    case 8:
23    	console.log("Summer");
24    	break;
25    // October, November, December
26    case 9:
27    case 10:
28    case 11:
29    	console.log("Autumn");
30    	break;
31    default:
32    	console.log("Something went wrong.");
33}

当我们运行代码时,我们将收到根据上述规格识别当前季节的输出。

1[secondary_label Output]
2Summer

发布时的当前月份为8,这与夏季季节产出的案例陈述之一相符。

结论

在本文中,我们审查了交换陈述,一种类型的 条件陈述,该陈述评估一个表达式并根据匹配结果输出不同的值。

要了解更多关于交换机的信息,您可以在 Mozilla 开发者网络上查看它。

Published At
Categories with 技术
comments powered by Disqus