js 中的switch表达式使用示例


Posted in Javascript onJune 03, 2020

前言

switch 语句用于基于不同条件执行不同动作。

JavaScript Switch 语句

请使用 switch 语句来选择多个需被执行的代码块之一。

switch(表达式) {
   case n:
    代码块
    break;
   case n:
    代码块
    break;
   default:
    默认代码块
}

代码解释:

计算一次 switch 表达式
把表达式的值与每个 case 的值进行对比
如果存在匹配,则执行关联代码
实例
getDay() 方法返回 0 至 6 之间的周名数字(weekday number)。

(Sunday=0, Monday=1, Tuesday=2 ..)

本例使用周名数字来计算周的名称:

switch (new Date().getDay()) {
  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 关键词

如果 JavaScript 遇到 break 关键词,它会跳出 switch 代码块。

此举将停止代码块中更多代码的执行以及 case 测试。

如果找到匹配,并完成任务,则随机中断执行(break)。无需更多测试。

break 能够节省大量执行时间,因为它会“忽略” switch 代码块中的其他代码的执行。

不必中断 switch 代码块中的最后一个 case。代码块在此处会自然结束。

default 关键词

default 关键词规定不存在 case 匹配时所运行的代码:

实例

getDay() 方法返回 0 至 6 的数字周名。

如果今日既不是周六(6)也不是周日(0),则输出一段默认消息:

switch (new Date().getDay()) {
  case 6:
    text = "今天是周六";
    break; 
  case 0:
    text = "今天是周日";
    break; 
  default: 
    text = "期待周末~";
}

text 的结果是:

期待周末~

默认的 case 不必是 switch 代码块中最后一个 case:

实例

switch (new Date().getDay()) {
  default: 
    text = "期待周末!";
     break;
  case 6:
    text = "今天是周六";
    break; 
  case 0:
    text = "今天是周日";
}

如果 default 不是 switch 代码块中最后一个 case,请记得用 break 结束默认 case。

常见的代码块

有时您会需要不同的 case 来使用相同的代码。

在本例中,case 4 和 5 分享相同的代码块,而 0 和 6 分享另一段代码块:

实例

switch (new Date().getDay()) {
  case 4:
  case 5:
    text = "周末快到了:)";
    break; 
  case 0:
  case 6:
    text = "今天是周末~";
     break;
  default: 
    text = "期待周末!";
}

Switching 的细节

如果多种 case 匹配一个 case 值,则选择第一个 case。

如果未找到匹配的 case,程序将继续使用默认 label。

如果未找到默认 label,程序将继续 switch 后的语句。

严格的比较

Switch case 使用严格比较(===)。

值必须与要匹配的类型相同。

只有操作数属于同一类型时,严格比较才能为 true。

在这个例子中,x 将不匹配:

实例

var x = "0";
switch (x) {
 case 0:
  text = "Off";
  break;
 case 1:
  text = "On";
  break;
 default:
  text = "No value found";
}

语法switch 这种表达式在很多语言中都有,比如java, C等待, 使用switch比使用if else 来得方便,来得清晰。

使用语法很简单:

switch(n) 
{ 
case 1: 
执行代码块 1 
break; 
case 2: 
执行代码块 2 
break; 
default: 
n 与 case 1 和 case 2 不同时执行的代码 
}

各种语言的使用基本类似。

需要特别提出的时,在java 1.6 及以下版本, 变量(n)只能是整型。在java 7 之后支持String类型了。

在js 中, 是可以直接使用String 类型。

使用实例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Author" CONTENT="oscar999"> 
<script> 
function funcSwitch(sFlag) 
{ 
switch(sFlag) 
{ 
case "Test1": 
alert("Test1"); 
break; 
case "Test2": 
alert("Test2"); 
break; 
default:; 
} 
} 

funcSwitch("Test2"); 
</script> 
</HEAD> 

<BODY> 

</BODY> 
</HTML>

逻辑很简单, 代码很简单。 直接使用string 来区分。

Case 对应的条件值也是变量

如果case 后面对应的不是一个字符串,而是一个变量的话。可以结合RegExp 达成。

<!--Add by oscar999--> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Author" CONTENT="oscar999"> 
<script> 
var str1 = "Test1"; 
var str2 = "Test1"; 
function funcSwitch(sFlag) 
{ 
var regExp = new RegExp(sFlag); 
switch(true) 
{ 
case regExp.test(str1): 
alert("Test1"); 
break; 
case regExp.test(str2): 
alert("Test2"); 
break; 
default:; 
} 
} 

funcSwitch("Test1"); 

</script> 
</HEAD> 

<BODY> 

</BODY> 
</HTML>
Javascript 相关文章推荐
基于jQuery的可以控制左右滚动及自动滚动效果的代码
Jul 25 Javascript
使用Plupload实现直接上传附件至七牛云存储
Dec 26 Javascript
jquery渐隐渐显的图片幻灯闪烁切换实现方法
Feb 26 Javascript
全面解析JavaScript中apply和call以及bind(推荐)
Jun 15 Javascript
javascript实现随机生成DIV背景色
Jun 20 Javascript
浅谈JavaScript对象与继承
Jul 10 Javascript
js事件驱动机制 浏览器兼容处理方法
Jul 23 Javascript
JS中的phototype详解
Feb 04 Javascript
javascript中UMD规范的代码推演
Aug 29 Javascript
JavaScript中的连续赋值问题实例分析
Jul 12 Javascript
JS函数本身的作用域实例分析
Mar 16 Javascript
JavaScript检测浏览器是否支持CSS变量代码实例
Apr 03 Javascript
javascript实现促销倒计时+fixed固定在底部
Sep 18 #Javascript
jquery等宽输出文字插件使用介绍
Sep 18 #Javascript
使用indexOf等在JavaScript的数组中进行元素查找和替换
Sep 18 #Javascript
JSON 数字排序多字段排序介绍
Sep 18 #Javascript
json数据与字符串的相互转化示例
Sep 18 #Javascript
如何让DIV可编辑、可拖动示例代码
Sep 18 #Javascript
jQuery extend 的简单实例
Sep 18 #Javascript
You might like
全国FM电台频率大全 - 6 辽宁省
2020/03/11 无线电
php面向对象全攻略 (二) 实例化对象 使用对象成员
2009/09/30 PHP
php提交表单时判断 if($_POST[submit])与 if(isset($_POST[submit])) 的区别
2011/02/08 PHP
浅析PHP原理之变量分离/引用(Variables Separation)
2013/08/09 PHP
php简单的上传类分享
2016/05/15 PHP
扩展jQuery 键盘事件的几个基本方法
2009/10/30 Javascript
基于JQuery的访问WebService的代码(可访问Java[Xfire])
2010/11/19 Javascript
js 连接数据库如何操作数据库中的数据
2012/11/23 Javascript
jquery插件推荐 jquery.cookie
2014/11/09 Javascript
AngularJS + Node.js + MongoDB开发的基于高德地图位置的通讯录
2015/01/02 Javascript
Angular2  NgModule 模块详解
2016/10/19 Javascript
火狐和ie下获取javascript 获取event的方法(推荐)
2016/11/26 Javascript
JS正则匹配URL网址的方法(可匹配www,http开头的一切网址)
2017/01/06 Javascript
AngularJS 应用模块化的使用
2018/04/04 Javascript
js图片无缝滚动插件使用详解
2020/05/26 Javascript
js实现点赞效果
2020/03/16 Javascript
vue实现点击出现操作弹出框的示例
2020/11/05 Javascript
[58:37]Serenity vs Fnatic 2018国际邀请赛淘汰赛BO1 8.21
2018/08/22 DOTA
探究python中open函数的使用
2016/03/01 Python
python基础_文件操作实现全文或单行替换的方法
2017/09/04 Python
Python+matplotlib实现计算两个信号的交叉谱密度实例
2018/01/08 Python
简单了解django orm中介模型
2019/07/30 Python
python 下 CMake 安装配置 OPENCV 4.1.1的方法
2019/09/30 Python
基于Numba提高python运行效率过程解析
2020/03/02 Python
Python列表如何更新值
2020/05/27 Python
前端canvas动画如何转成mp4视频的方法
2019/06/17 HTML / CSS
美国老牌主机服务商:iPage
2016/07/22 全球购物
ECOSUSI官网:女式皮革背包
2019/09/27 全球购物
会计实习生自我鉴定
2013/12/12 职场文书
白酒业务员岗位职责
2013/12/27 职场文书
销售人员自我评价
2014/02/01 职场文书
贫困证明模板(3篇)
2014/09/16 职场文书
乡镇干部先进性教育活动个人整改措施
2014/09/16 职场文书
老人再婚离婚协议书范本
2014/10/27 职场文书
2014年卫生工作总结
2014/11/27 职场文书
优秀大学生自荐信
2015/03/26 职场文书