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 相关文章推荐
利用javascript中的call实现继承
Jan 22 Javascript
Google 静态地图API实现代码
Nov 19 Javascript
基于jquery点击自以外任意处,关闭自身的代码
Feb 10 Javascript
JSONP 跨域访问代理API-yahooapis实现代码
Dec 02 Javascript
Javascript中各种trim的实现详细解析
Dec 10 Javascript
JavaScript运算符小结
Jun 03 Javascript
AngularJS递归指令实现Tree View效果示例
Nov 07 Javascript
vue父组件中获取子组件中的数据(实例讲解)
Sep 27 Javascript
关于JavaScript中高阶函数的魅力详解
Sep 07 Javascript
JavaScript将数组转换为链表的方法
Feb 16 Javascript
原生javascript制作的拼图游戏实现方法详解
Feb 23 Javascript
ES6函数和数组用法实例分析
May 23 Javascript
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
星际争霸任务指南——虫族
2020/03/04 星际争霸
Mysql中分页查询的两个解决方法比较
2013/05/02 PHP
PHP统计二维数组元素个数的方法
2013/11/12 PHP
PHP中auto_prepend_file与auto_append_file用法实例分析
2014/09/22 PHP
PHP中16个高危函数整理
2019/09/19 PHP
js捕获鼠标滚轮事件代码
2013/12/16 Javascript
js 左右悬浮对联广告代码示例
2014/12/12 Javascript
jQuery的选择器中的通配符[id^='code']或[name^='code']及jquery选择器总结
2015/12/24 Javascript
解决bootstrap导航栏navbar在IE8上存在缺陷的方法
2016/07/01 Javascript
AngularJS之依赖注入模拟实现
2016/08/19 Javascript
Bootstrap3多级下拉菜单
2017/02/24 Javascript
微信小程序 滚动到某个位置添加class效果实现代码
2017/04/19 Javascript
js每隔两秒输出数组中的一项(实例)
2017/05/28 Javascript
nodejs利用ajax实现网页无刷新上传图片实例代码
2017/06/06 NodeJs
微信小程序 http请求的session管理
2017/06/07 Javascript
利用three.js画一个3D立体的正方体示例代码
2017/11/19 Javascript
node将geojson转shp返回给前端的实现方法
2019/05/29 Javascript
解决vue.js提交数组时出现数组下标的问题
2019/11/05 Javascript
vue+iview实现文件上传
2020/11/17 Vue.js
python pandas消除空值和空格以及 Nan数据替换方法
2018/10/30 Python
CentOS 7下安装Python3.6 及遇到的问题小结
2018/11/08 Python
python常用库之NumPy和sklearn入门
2019/07/11 Python
Python3 把一个列表按指定数目分成多个列表的方式
2019/12/25 Python
浅谈tensorflow 中的图片读取和裁剪方式
2020/06/30 Python
如何基于Python爬取隐秘的角落评论
2020/07/02 Python
Python 捕获代码中所有异常的方法
2020/08/03 Python
在Python中实现字典反转案例
2020/12/05 Python
下面关于"联合"的题目的输出是什么
2013/08/06 面试题
最新自我评价范文
2013/11/16 职场文书
《长相思》听课反思
2014/04/10 职场文书
电钳工人个人求职信
2014/05/10 职场文书
计算机网络专业求职信
2014/06/05 职场文书
学校党的群众路线教育实践活动制度建设计划
2014/11/03 职场文书
离婚承诺书格式范文
2015/05/04 职场文书
拾金不昧表扬稿大全
2015/05/05 职场文书
如何用Navicat操作MySQL
2021/05/12 MySQL