JavaScript中switch语句的用法详解


Posted in Javascript onJune 03, 2015

 可以使用多个if... else if语句,如前面的章节,执行多路分支。然而,这并不总是最佳的解决方案,尤其是当所有分支的依赖单一的变量的值。

使用JavaScript1.2开始,你可以用它处理的正是这种情况,使用一个switch语句,它这样做更有效,如果不是反复地使用if... else if语句。
语法

switch语句的基本语法给出一个expression ,以评估计算几种不同的语句基于该表达式的值来执行。解释器检查对表达式的值的每一种情况,直到找到一个匹配。如果没有匹配,则缺省(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语句指示的解释器是特定情况下结束。如果它们被省略,则解释器将继续在以下每个情况(case)执行每个语句。

我们将解释break语句在循环控制这一章。
例子:

下面的例子说明了一个基本的while循环:

<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语句:

<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 相关文章推荐
网页自动跳转代码收集
Sep 27 Javascript
JQuery的html(data)方法与&amp;lt;script&amp;gt;脚本块的解决方法
Mar 09 Javascript
js操作二级联动实现代码
Jul 27 Javascript
jquery ajax 局部无刷新更新数据的实现案例
Feb 08 Javascript
浅谈Javascript线程及定时机制
Jul 02 Javascript
使用递归遍历对象获得value值的实现方法
Jun 14 Javascript
详解javascript立即执行函数表达式IIFE
Feb 13 Javascript
js实现截图保存图片功能的代码示例
Feb 16 Javascript
angular-tree-component的使用详解
Jul 30 Javascript
微信小程序生成二维码的示例代码
Mar 29 Javascript
js实现图片3D轮播效果
Sep 21 Javascript
jQuery 实现扁平式小清新导航
Jul 07 jQuery
jquery中添加属性和删除属性
Jun 03 #Javascript
JavaScript中的条件判断语句使用详解
Jun 03 #Javascript
简单介绍JavaScript的变量和数据类型
Jun 03 #Javascript
在HTML中插入JavaScript代码的示例
Jun 03 #Javascript
jQuery事件绑定on()、bind()与delegate() 方法详解
Jun 03 #Javascript
在浏览器中打开或关闭JavaScript的方法
Jun 03 #Javascript
浅谈javascript中基本包装类型
Jun 03 #Javascript
You might like
php获取地址栏信息的代码
2008/10/08 PHP
PHP中mysql_field_type()函数用法
2014/11/24 PHP
php实现解析xml并生成sql语句的方法
2018/02/03 PHP
php使用socket调用http和smtp协议实例小结
2019/07/26 PHP
PHP设计模式之迭代器模式Iterator实例分析【对象行为型】
2020/04/26 PHP
在IE下:float属性会影响offsetTop的取值
2006/12/22 Javascript
Javascript 遍历对象中的子对象
2009/07/03 Javascript
手把手教你自己写一个js表单验证框架的方法
2010/09/14 Javascript
JavaScript地图拖动功能SpryMap的简单实现
2013/07/17 Javascript
JS 对输入框进行限制(常用的都有)
2013/07/30 Javascript
jquery提交form表单时禁止重复提交的方法
2014/02/13 Javascript
node.js中使用socket.io的方法
2014/12/15 Javascript
jQuery实现的自定义弹出层效果实例详解
2016/09/04 Javascript
javascript实现简单的ajax封装示例
2016/12/28 Javascript
Angularjs上传文件组件flowjs功能
2017/08/07 Javascript
vue实现长图垂直居上 vue实现短图垂直居中
2017/10/18 Javascript
基于Vue的ajax公共方法(详解)
2018/01/20 Javascript
vue移动UI框架滑动加载数据的方法
2018/03/12 Javascript
vue写一个组件
2018/04/09 Javascript
Vue列表渲染的示例代码
2018/11/01 Javascript
微信小程序框架的页面布局代码
2019/08/17 Javascript
Openlayers实现点闪烁扩散效果
2020/09/24 Javascript
解决vuex刷新数据消失问题
2020/11/12 Javascript
[43:32]Winstrike vs VGJ.S 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
python生成二维码的实例详解
2017/10/29 Python
对python字典过滤条件的实例详解
2019/01/22 Python
python工具快速为音视频自动生成字幕(使用说明)
2021/01/27 Python
CSS3移动端vw+rem不依赖JS实现响应式布局的方法
2019/01/23 HTML / CSS
介绍一下Mysql的存储引擎
2015/02/12 面试题
个人委托书范本
2014/04/02 职场文书
工程售后服务方案
2014/06/08 职场文书
秋季运动会开幕词
2015/01/28 职场文书
教师节倡议书2015
2015/04/27 职场文书
抢劫罪辩护词
2015/05/21 职场文书
python pygame入门教程
2021/06/01 Python
Redis基本数据类型List常用操作命令
2022/06/01 Redis