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 相关文章推荐
用javascript做拖动布局的思路
May 31 Javascript
jQuery 源码分析笔记(3) Deferred机制
Jun 19 Javascript
JQuery实现动态添加删除评论的方法
May 18 Javascript
js中跨域方法原理详解
Jul 19 Javascript
实例代码详解javascript实现窗口抖动及qq窗口抖动
Jan 04 Javascript
基于JavaScript实现智能右键菜单
Mar 02 Javascript
超实用的JavaScript代码段 附使用方法
May 22 Javascript
jQuery Validate 数组 全部验证问题
Jan 12 Javascript
webpack的CSS加载器的使用
Sep 11 Javascript
vue文件运行的方法教学
Feb 12 Javascript
解决vue-cli 打包后自定义动画未执行的问题
Nov 12 Javascript
利用JS如何获取form表单数据
Dec 19 Javascript
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递归实现无限分类生成下拉列表的函数
2010/08/08 PHP
php实现最简单的MVC框架实例教程
2014/09/08 PHP
Yii框架关联查询with用法分析
2014/12/02 PHP
PHP加密技术的简单实现
2016/09/04 PHP
Laravel中获取路由参数Route Parameters的五种方法示例
2017/09/29 PHP
如何在Mozilla Gecko 用Javascript加载XSL
2007/01/09 Javascript
javascript之querySelector和querySelectorAll使用介绍
2011/12/20 Javascript
JS下拉框内容左右移动效果的具体实现
2013/07/10 Javascript
Javascript中string转date示例代码
2013/11/01 Javascript
Jquery实现的角色左右选择特效
2014/05/21 Javascript
javascript对中文按照拼音排序代码
2014/08/20 Javascript
jQuery+PHP实现动态数字展示特效
2015/03/14 Javascript
JS实现定时自动关闭DIV层提示框的方法
2015/05/11 Javascript
javascript实现数组去重的多种方法
2016/03/14 Javascript
全面了解js中的script标签
2016/07/04 Javascript
从零学习node.js之利用express搭建简易论坛(七)
2017/02/25 Javascript
解决vuejs 使用value in list 循环遍历数组出现警告的问题
2018/09/26 Javascript
解决vue v-for src 图片路径问题 404
2019/11/12 Javascript
微信小程序canvas截取任意形状的实现代码
2020/01/13 Javascript
[46:02]DOTA2上海特级锦标赛D组资格赛#2 Liquid VS VP第二局
2016/02/28 DOTA
[01:38:19]夜魇凡尔赛茶话会 第五期
2021/03/11 DOTA
使用Python内置的模块与函数进行不同进制的数的转换
2016/03/12 Python
Python单链表简单实现代码
2016/04/27 Python
轻松理解Python 中的 descriptor
2017/09/15 Python
Python爬虫设置代理IP的方法(爬虫技巧)
2018/03/04 Python
使用Eclipse如何开发python脚本
2018/04/11 Python
浅谈Python中函数的定义及其调用方法
2019/07/19 Python
Python学习笔记之文件的读写操作实例分析
2019/08/07 Python
Python3 venv搭建轻量级虚拟环境的步骤(图文)
2019/08/09 Python
python禁用键鼠与提权代码实例
2019/08/16 Python
Python读取yaml文件的详细教程
2020/07/21 Python
戴森英国官网:Dyson英国
2019/05/07 全球购物
Lookfantastic澳大利亚官网:英国知名美妆购物网站
2021/01/07 全球购物
送餐员岗位职责范本
2014/02/21 职场文书
党的生日演讲稿
2014/09/10 职场文书
2015年图书馆个人工作总结
2015/05/26 职场文书