JavaScript条件判断_动力节点Java学院整理


Posted in Javascript onJune 26, 2017

JavaScript使用if () { ... } else { ... }来进行条件判断。例如,根据年龄显示不同内容,可以用if语句实现如下:

var age = 20;
if (age >= 18) { // 如果age >= 18为true,则执行if语句块
  alert('adult');
} else { // 否则执行else语句块
  alert('teenager');
}

其中else语句是可选的。如果语句块只包含一条语句,那么可以省略{}:

var age = 20;
if (age >= 18)
  alert('adult');
else
  alert('teenager');

省略{}的危险之处在于,如果后来想添加一些语句,却忘了写{},就改变了if...else...的语义,例如:

var age = 20;
if (age >= 18)
  alert('adult');
else
  console.log('age < 18'); // 添加一行日志
  alert('teenager'); // <- 这行语句已经不在else的控制范围了

上述代码的else子句实际上只负责执行console.log('age < 18');,原有的alert('teenager');已经不属于if...else...的控制范围了,它每次都会执行。

相反地,有{}的语句就不会出错:

var age = 20;
if (age >= 18) {
  alert('adult');
} else {
  console.log('age < 18');
  alert('teenager');
}

这就是为什么我们建议永远都要写上{}。

多行条件判断

如果还要更细致地判断条件,可以使用多个if...else...的组合:

var age = 3;
if (age >= 18) {
  alert('adult');
} else if (age >= 6) {
  alert('teenager');
} else {
  alert('kid');
}

上述多个if...else...的组合实际上相当于两层if...else...:

var age = 3;
if (age >= 18) {
  alert('adult');
} else {
  if (age >= 6) {
    alert('teenager');
  } else {
    alert('kid');
  }
}

但是我们通常把else if连写在一起,来增加可读性。这里的else略掉了{}是没有问题的,因为它只包含一个if语句。注意最后一个单独的else不要略掉{}。

请注意,if...else...语句的执行特点是二选一,在多个if...else...语句中,如果某个条件成立,则后续就不再继续判断了。

Javascript 相关文章推荐
jquery实现div阴影效果示例代码
Sep 16 Javascript
moment.js轻松实现获取当前日期是当年的第几周
Feb 05 Javascript
jQuery的几个我们必须了解的特点
May 03 Javascript
js+html5通过canvas指定开始和结束点绘制线条的方法
Jun 05 Javascript
js如何改变文章的字体大小
Jan 08 Javascript
js中字符串编码函数escape()、encodeURI()、encodeURIComponent()区别详解
Apr 01 Javascript
JS提示:Uncaught SyntaxError:Unexpected token ) 错误的解决方法
Aug 19 Javascript
ionic进入多级目录后隐藏底部导航栏(tabs)的完美解决方案
Nov 23 Javascript
使用watch监听路由变化和watch监听对象的实例
Feb 24 Javascript
AngularJS与后端php的数据交互方法
Aug 13 Javascript
vue-cli随机生成port源码的方法
Sep 02 Javascript
vue使用echarts实现折线图
Mar 21 Vue.js
JavaScript脚本语言是什么_动力节点Java学院整理
Jun 26 #Javascript
JavaScript简介_动力节点Java学院整理
Jun 26 #Javascript
JavaScript数组_动力节点Java学院整理
Jun 26 #Javascript
Angular 表单控件示例代码
Jun 26 #Javascript
jQuery实现一个简单的验证码功能
Jun 26 #jQuery
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
Jun 26 #jQuery
JavaScript实现三级联动菜单实例代码
Jun 26 #Javascript
You might like
php生成酷炫的四个字符验证码
2016/04/22 PHP
PHP使用内置函数生成图片的方法详解
2016/05/09 PHP
详细解读php的命名空间(一)
2018/02/21 PHP
网上抓的一个特效
2007/05/11 Javascript
use jscript List Installed Software
2007/06/11 Javascript
页面调用单个swf文件,嵌套出多个方法。
2011/11/21 Javascript
Js 获取Gridview选中行的内容操作步骤
2013/02/05 Javascript
js 判断浏览器使用的语言示例代码
2014/03/22 Javascript
JavaScript必知必会(五) eval 的使用
2016/06/08 Javascript
jQuery+HTML5实现弹出创意搜索框层
2016/12/29 Javascript
js实现网页定位导航功能
2017/03/07 Javascript
javaScript 逻辑运算符使用技巧整理
2017/05/03 Javascript
简单实现js鼠标跟随效果
2020/08/02 Javascript
关于JavaScript中高阶函数的魅力详解
2018/09/07 Javascript
2种在vue项目中使用百度地图的简单方法
2018/09/28 Javascript
小程序实现锚点滑动效果
2019/09/23 Javascript
JavaScript事件冒泡机制原理实例解析
2020/01/14 Javascript
解决Python出现_warn_unsafe_extraction问题的方法
2016/03/24 Python
在Linux命令行终端中使用python的简单方法(推荐)
2017/01/23 Python
Python建立Map写Excel表实例解析
2018/01/17 Python
Python实现的凯撒密码算法示例
2018/04/12 Python
使用django-guardian实现django-admin的行级权限控制的方法
2018/10/30 Python
用Python解数独的方法示例
2019/10/24 Python
Python实现对adb命令封装
2020/03/06 Python
在spyder IPython console中,运行代码加入参数的实例
2020/04/20 Python
jupyter notebook的安装与使用详解
2020/05/18 Python
Flask处理Web表单的实现方法
2021/01/31 Python
HTML5基于flash实现播放RTMP协议视频的示例代码
2020/12/04 HTML / CSS
几道Web/Ajax的面试题
2016/11/05 面试题
数控技术专科生自我评价
2014/01/08 职场文书
生态养殖创业计划书
2014/05/06 职场文书
无财产离婚协议书范本
2014/10/28 职场文书
求职信内容一般写什么?
2015/03/20 职场文书
2015年人事专员工作总结
2015/04/29 职场文书
医院见习总结
2015/06/24 职场文书
演讲比赛通讯稿
2015/07/18 职场文书