switch语句以及与if的比较
HTML5学堂:JS的三大语句类型当中,有一种分支/选择性语句——switch。我们常说switch可以适当的和if配合使用,那么switch语句到底怎么书写,如何运用,和if语句的区别以及选用原则又是什么?一起来看今天的内容。
有时并不那么友好的if语句
条件语句,我们通常都使用if来处理,特别是针对一个范围区间,需要执行不同功能代码时,尤为可用。但是,一旦遇到如下这种情形,我们就会觉得if有些麻烦了~
if (rank == 'A') {
console.log('优秀');
} else if (rank == 'B') {
console.log('良好');
} else if (rank == 'C') {
console.log('一般');
} else if (rank == 'D') {
console.log('需要加油啦');
} else {
console.log('差');
}
上面这种if结构,针对一种答案需要执行一种内容,且条件并非区间。此时,的确可以使用if语句,但是从视觉上来说,很容易造成的混乱,一旦代码出问题,排查错误相对比较麻烦,而switch语句恰恰可以解决这种尴尬。
switch语句的基本语法
如下为switch语句的基本语法:
switch(表达式A) {
case 表达式1 : 代码段1;
break;
case 表达式2 : 代码段2;
break;
case 表达式3 : 代码段3;
break;
default : 代码段4;
}
1 表达式A是要进行判断/比对的表达式,让每个case后面的表达式与表达式A相比较,如果两者全等,则执行相应case后面的语句。
2 break关键字可以结束switch语句。break语句并非必须存在的,如果没有break,则从符合条件的case开始一直往下执行到switch结束或者遇到break。
3 default,一般用在最后,表示非以上的任何情况下而发生的情况。switch最后执行default语句,如果default后面带有break,那么程序就会正常跳出switch,否则,程序会继续向后执行switch语句。也就是说,不管default放在什么位置,它总是在最后一个处理,然后继续向下处理。
4 此外,可以有多个case的语句。(加入两种case要执行同样的内容,可以书写为 case 表达式1: case 表达式2: 代码段)
对于如上几点不是很清楚的童鞋不要着急,一会我们会书写例子。现在先来看看,如果我们使用switch代替if语句书写上面的例子,会不会变得简单一些呢?
switch书写刚刚的实例
<script>
var rank = 'B';
switch (rank) {
case 'A' : console.log('优秀'); break;
case 'B' : console.log('良好'); break;
case 'C' : console.log('一般'); break;
case 'D' : console.log('需要加油啦'); break;
default : console.log('差'); break;
}
</script>
很明显,针对这个例子,从可读性的角度来说,switch要简单的多。
switch语句中具体命令实例
关于break语句
如果在一个case命令后不书写break,会是什么结果?看如下例子:
<script>
var rank = 'B';
switch (rank) {
case 'A' : console.log('优秀'); break;
case 'B' : console.log('良好');
case 'C' : console.log('一般');
case 'D' : console.log('需要加油啦'); break;
default : console.log('差'); break;
}
</script>
此段代码会输出:“良好” “一般” “需要加油啦”。之所以是这个结果,就在于我们之前刚刚提过的:如果没有break,则从符合条件的case开始一直往下执行到switch结束或者遇到break。
关于default语句
如果defalut语句放在了前面怎么办呢?看如下例子:
<script>
var rank = 'E';
switch (rank) {
default : console.log('差'); break;
case 'A' : console.log('优秀'); break;
case 'B' : console.log('良好'); break;
case 'C' : console.log('一般'); break;
case 'D' : console.log('需要加油啦'); break;
}
</script>
此处rank为E,必然不符合A~D,所以执行default。输出“差”,之后遇到了break,直接跳出switch语句。
稍微调整一下代码:
<script>
var rank = 'E';
switch (rank) {
default : console.log('差');
case 'A' : console.log('优秀'); break;
case 'B' : console.log('良好'); break;
case 'C' : console.log('一般'); break;
case 'D' : console.log('需要加油啦'); break;
}
</script>
此处输出的则是“差” “优秀”。这就是说,不管default放在什么位置,它总是在最后一个处理,然后继续向下处理。。因此,为了避免出现错误的结果,最好办法就是每一个case以及default语句都要加一个break语句。
JS的switch与其他语言的不同
JS中的switch语句中可以使用任何数据类型(很多其他语言只能使用数值),case的值也不一定是常量,也可以是表达式。如下面实例:
switch语句为表达式 - 实例
var x = 5;
switch(x > 3) {
case true : console.log('x > 3'); break;
case false : console.log('x <= 3'); break;
}
switch语句的case值为表达式 - 实例
switch("h5course") {
case "h5" + "course": alert("h5course");
break;
case "HTML5Course" : alert("HTML5Course");
break;
default : alert("other");
}
需要注意的是,switch语句在进行值的比较时,使用的是全等操作符("==="),也就是说两个表达式的结果,既需要值一样,也要类型相同。
if与switch的选择
1 从视觉层面上来说,对于一部分功能,选用switch语句可以精简代码,提升视觉效果。
2 从性能角度来说,由于switch的条件简单,编译器会为它做二分法优化(或跳转表),平均性能相对会高一些。而if else所比较的条件会远远比switch的复杂,编译器通常不会做过多的优化。简言之就是对于常量方面的条件判断,switch性能略胜于if语句。
到底何时使用switch?
如果需要判断的是几个常量的数据,建议使用switch;如果条件比较复杂(如:x > 3 && x < 10),建议使用if语句。
- C 语言字符串分割函数
- 10.14 iptables语法
- 为安全出把力:CVE-2011-1938漏洞分析以及exp编写
- 10.13 netfilter5表5链介绍
- 用JAVA测量DEA页面的社交媒体流行度
- Java数组赋值
- 10.12 firewalld和netfilter
- 10.11 Linux网络相关
- 利用Crypto++实现RSA加密算法
- 重学javascript 红皮高程(6)
- WriteUp分享 | LCTF的一道preg_match绕过+出题人的锅
- 利用crypto++库实现AES加密算法
- Android之倒计时CountdownTimer用法
- WriteUp分享 | LCTF的一道padding oracle攻击+sprintf格式化字符串导致的SQL注入
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法