JavaScript中的switch语句

yuyutoo 2024-12-01 06:11 7 浏览 0 评论

JavaScript语言中的条件语句，除了if 语句，还有switch 语句。switch 常用于根据不同的条件执行不同的操作。虽然它和 if 语句都是用来判断条件的语句，但是它们之间还是有不同。

switch的语法

语法如下所示：

switch(expression) {
    case 变量x:
    // 语句1代码块
    case 变量y:
    // 语句2代码块
    case 变量z:
    // 语句3代码块
    break;
    default:
    // 代码块
}

语法解释：表达式值计算一次，然后我们依次将表达式的值与每一种 case 情况的值进行比较，如果匹配，就会执行与 case 对应的相关代码块。

执行原理：变量 expression 的值与 case 的值进行比较，比如变量 expression 等于 case 变量 x，我们就执行语句1的代码块，如果变量 expression 等于 case 变量 y 就执行语句2的代码块，依次类推，如果都不符合就执行 default 语句代码块。break 语言用于结束当前执行的语句，default 表示默认的，在没有符合选项的时候默认选择。

示例：

使用 switch 语句来看判断今天是星期几，并输出对应时间。例如在一个 HTML 文件中，写入下列代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS_侠课岛(9xkd.com)</title>
</head>
<body>
  <div>
    <p id="date"></p>
  </div>
  <script>
    var day;
    var d = new Date().getDay();  
    switch(d) {
        case 0:
          day = "星期天";
          break;
        case 1:
          day = "星期一";
          break;
        case 2:
          day = "星期二";
          break;
        case 3:
          day = "星期三";
          break;
        case 4:
          day = "星期四";
          break;
        case 5:
          day = "星期五";
          break;
        case 6:
          day = "星期六";
          break;
        case 7:
          day = "星期天";
          break;
    }
    document.getElementById("date").innerHTML = day;
    </script>
  </body>    
</html>

在浏览器中打开这个HTML文件，页面会显示：

星期二

我们来分析一下 <script> 标签中的 JavaScript 代码，变量 d 是我们获取到的当天的星期天数（我写这个文章的时候是星期二），getDay() 方法会返回与星期相对应的数字，例如星期一返回1、星期二返回2，以此类推。

然后我们将这个变量 d 作为switch 语句的表达式值，将它与 case 后面的值匹配，如果表达式等于某个 case 后面的值，则执行响应的代码。例如上述代码中，变量 d 的值为2，那么就会匹配到 case 2，所对应的代码就是day = "星期二";，所以输出结果为星期二。后面还有一个break 语句，这个语句的作用就是跳出 switch 语句，避免同时执行多个case。

default 关键词

default 关键词规定 case 匹配不存在时所做的事情。

示例：

例如我们看下面这段代码：

var level = "P";
switch(level){
    case "A":
        console.log("第一类");
        break;
    case "B":
        console.log("第二类");
        break;
    case "C":
        console.log("第三类");
        break;
    case "D":
        console.log("第四类");
        break;
    default:
        console.log("其他");
}

输出：

其他

上述代码中，如果 level 的值不满足任何 case 的值，则会匹配到 default。代码中 level 的值为 P，而 case 语句中的值只有A、B、C、D，此时就会匹配到 default 语句，执行 default 语句下面的代码。

break 关键词用于跳出 switch 代码块。使用 break 能够节省大量执行时间，因为它会忽略 switch 代码块中的其他代码的执行。

switch 与 if 的对比

关于条件分支 switch 和 if 两者之间的区别和关联，我们可以通过下面这个表格进行简单直观的认识：

if 语句表达式的结果是 boolean 布尔类型，常用于区间判断。
switch 表达式类型不能是 boolean 布尔类型，可能是 byte、int、char、string、枚举，常用于等值判断。

注意一般能用 switch 语句实现的就一定能使用 if 语句来实现，但是反过来却是不一定的，如果区间范围就采用 if，如果等值判断就使用 switch。

效率问题：

switch case 会生成一个跳转表来指示实际的 case 分支地址。
switch case 只能处理 case 为常量的情况。
if else 需要遍历条件分支知道命中条件。
if else 能应用于更多的场所，比较灵活，但是必须遍历所有可能的值。

动手小练习

写一个小程序，让用户输入月份，提示相应的季节，如果都不在指定的月份中则输出"请正确输入月份"。
熟记 switch 和 if 的基本内容以及两者间的关联与区别。

switchcase语句

上一篇：编程专题:JAVA语法基础(switch语句)
下一篇：写给大家看的学习笔记04:了解Switch语句

JavaScript中的switch语句

switch的语法

default 关键词

switch 与 if 的对比

动手小练习

相关推荐

取消回复欢迎你发表评论:

前端面试:iframe 的优缺点? iframe有那些缺点

带斜线的表头制作好了，如何填充内容?这几种方法你更喜欢哪个?

漫学笔记之PHP.ini常用的配置信息

其实模版网站在开发工作中很重要，推荐几个参考站给大家

推荐7个模板代码和其他游戏源码下载的网址

[干货] JAVA - JVM - 2 内存两分 [干货]+java+-+jvm+-+2+内存两分吗

正在学习使用python搭建自动化测试框架?这个系统包你可能会用到

织梦(Dedecms)建站教程织梦建站详细步骤

【开源分享】2024PHP在线客服系统源码(搭建教程+终身使用)

2024PHP在线客服系统源码+完全开源带详细搭建教程

JavaScript中的switch语句

switch的语法

default 关键词

switch 与 if 的对比

动手小练习

相关推荐

取消回复欢迎 你 发表评论:

前端面试:iframe 的优缺点? iframe有那些缺点

带斜线的表头制作好了，如何填充内容?这几种方法你更喜欢哪个?

漫学笔记之PHP.ini常用的配置信息

其实模版网站在开发工作中很重要，推荐几个参考站给大家

推荐7个模板代码和其他游戏源码下载的网址

[干货] JAVA - JVM - 2 内存两分 [干货]+java+-+jvm+-+2+内存两分吗

正在学习使用python搭建自动化测试框架?这个系统包你可能会用到

织梦(Dedecms)建站教程 织梦建站详细步骤

【开源分享】2024PHP在线客服系统源码(搭建教程+终身使用)

2024PHP在线客服系统源码+完全开源 带详细搭建教程

取消回复欢迎你发表评论:

织梦(Dedecms)建站教程织梦建站详细步骤

2024PHP在线客服系统源码+完全开源带详细搭建教程