javascript if条件判断方法小结


Posted in Javascript onMay 17, 2014

条件语句用于基于不同的条件来执行不同的动作。

条件语句

通常在写代码时,您总是需要为不同的决定来执行不同的动作。您可以在代码中使用条件语句来完成该任务。

在 JavaScript 中,我们可使用以下条件语句:

•if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码
•if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码
•if...else if....else 语句 - 使用该语句来选择多个代码块之一来执行
•switch 语句 - 使用该语句来选择多个代码块之一来执行

If 语句

只有当指定条件为 true 时,该语句才会执行代码。

语法

if (条件)
  {
  只有当条件为 true 时执行的代码
  }

注意:请使用小写的 if。使用大写字母(IF)会生成 JavaScript 错误!

实例
当时间小于 20:00 时,生成一个“Good day”问候:

if (time<20)
  {
  x="Good day";
  }

x 的结果是:

Good day

亲自试一试

请注意,在这个语法中,没有 ..else..。您已经告诉浏览器只有在指定条件为 true 时才执行代码。
If...else 语句
请使用 if....else 语句在条件为 true 时执行代码,在条件为 false 时执行其他代码。

语法

if (条件)
  {
  当条件为 true 时执行的代码
  }
else
  {
  当条件不为 true 时执行的代码
  }
 

实例
当时间小于 20:00 时,将得到问候 "Good day",否则将得到问候 "Good evening"。

if (time<20)
  {
  x="Good day";
  }
else
  {
  x="Good evening";
  }
 

x 的结果是:

Good day

亲自试一试
If...else if...else 语句
使用 if....else if...else 语句来选择多个代码块之一来执行。

语法

if (条件 1)
  {
  当条件 1 为 true 时执行的代码
  }
else if (条件 2)
  {
  当条件 2 为 true 时执行的代码
  }
else
  {
  当条件 1 和 条件 2 都不为 true 时执行的代码
  }

实例
如果时间小于 10:00,则将发送问候 "Good morning",否则如果时间小于 20:00,则发送问候 "Good day",否则发送问候 "Good evening":
if (time<10)
  {
  x="Good morning";
  }
else if (time<20)
  {
  x="Good day";
  }
else
  {
  x="Good evening";
  }

x 的结果是:

Good morning

在javascript中,哪些值能作为if的条件呢

1、布尔变量true/false
2、数字非0,非NaN/ (0 或NaN)

见下面的例子,莫以为负数就以为if语句为假了。

var i = -1;
if(i){
 alert('here');
}else{
 alert('test is ok!');
}

3、对象非null/(null或undefined)
4、字符串非空串(“”)/空串("")

综上所述,对于字符串,不用写一大堆if(str!=null && str!=undefined && str !=''), 只要用一句

if(!str){
    //do something
}

就可以了。

对于数字的非空判断,则要考虑使用isNaN()函数,NaN不和任何类型数据相等,包括它本身,只能用isNaN()判断。对于数字类型,if(a)语句中的a为0时if(a)为假,非0时if(a)为真

var b;
var a = 0;
a = a + b;
if(a){
 alert('1');
}else{
 alert('2');
}
if(isNaN(a)){
 alert('a is NaN');
}

javascript教程:关于if语句优化的方法 if简写

UglifyJS是一个对javascript进行压缩和美化的工具,在它的文档说明中,我看到了几种关于if语句优化的方法。尽管我还没使用它去做一些尝试性的测试,但从这里可以看到它的确对js作了美化的工作。也许有人认为if语句就那么简单,能优化到什么程度?但是看看以下的几种方式,你也许会改变看法。

一、使用常见的三元操作符

if (foo) bar(); else baz(); ==> foo?bar():baz();
if (!foo) bar(); else baz(); ==> foo?baz():bar();
if (foo) return bar(); else return baz(); ==> return foo?bar():baz();

对于以上使用三元操作符来优化if语句你肯定不会陌生,或许你经常使用它。

三水点靠木给出的例子:

<script>
var i=9
var ii=(i>8)?100:9;
alert(ii);
</script>

输出结果:

100

二、使用and(&&)和or(||)运算符

if (foo) bar(); ==> foo&&bar();
if (!foo) bar(); ==> foo||bar();

老实说,我并没有这样去写过代码,这种写法我在学习《鸟哥的 Linux 私房菜》时看到过,但我并没想到在js中实现它。

三、省略大括号{}

if (foo) return bar(); else something(); ==> {if(foo)return bar();something()}

这种写法你我都很熟悉,但我建议在代码优化的时候这样做,或者交给UglifyJS帮你去解决。毕竟少一个大括号,代码的可阅读性并不高。

写到这里,我想到jQuery之父在《精通 JavaScript》中的一个获取HTML元素属性的方法。

function getAttr(el, attrName){
var attr = {'for':'htmlFor', 'class':'className'}[attrName] || attrName;
};

如果我们不这样写,可能我们需借助于两个if语句来进行处理,而上面的代码不仅简洁有效,而且可阅读性强。

仔细想想,好些时候我们都能找到解决问题的有效途径,但关键在于我们是否用心去寻找一种更好的途径。

【javascript技巧】if(x==null)简写

if(x==null)或if (typeof (x) == 'undefined')可以简写为if(!x),未验证。

反之if(x)表示x非空

判断对象是否存在

if(document.form1.softurl9){
//判断是否存在softurl9,防止js出错
}
if(document.getElementById("softurl9")){
//判断是否存在softurl9,防止js出错
}
Javascript 相关文章推荐
ext 代码生成器
Aug 07 Javascript
javascript 快速排序函数代码
May 30 Javascript
Firefox中通过JavaScript复制数据到剪贴板(Copy to Clipboard 跨浏览器版)
Nov 22 Javascript
JS控件ASP.NET的treeview控件全选或者取消(示例代码)
Dec 16 Javascript
DOM 事件流详解
Jan 20 Javascript
JavaScript的Date()方法使用详解
Jun 09 Javascript
JavaScript弹窗基础篇
Apr 27 Javascript
JS工作中的小贴士之”闭包“与事件委托的”阻止冒泡“
Jun 16 Javascript
js实现上下左右弹框划出效果
Mar 08 Javascript
angularJS实现动态添加,删除div方法
Feb 27 Javascript
webpack源码之loader机制详解
Apr 06 Javascript
了解javascript中的Dom操作
May 27 Javascript
js加减乘除丢失精度问题解决方法
May 16 #Javascript
js脚本获取webform服务器控件的方法
May 16 #Javascript
js加入收藏夹代码(兼容ie/ff/op)
May 16 #Javascript
javascript生成随机数的方法
May 16 #Javascript
从零学jquery之如何使用回调函数
May 16 #Javascript
一张表格告诉你windows.onload()与$(document).ready()的区别
May 16 #Javascript
Jquery倒计时源码分享
May 16 #Javascript
You might like
PHP读取ACCESS数据到MYSQL的代码
2011/05/11 PHP
解决php使用异步调用获取数据时出现(错误c00ce56e导致此项操作无法完成)
2013/07/03 PHP
[原创]PHP实现生成vcf vcard文件功能类定义与使用方法详解【附demo源码下载】
2017/09/02 PHP
My Desktop :) 桌面式代码
2008/12/29 Javascript
兼容IE和FF的js脚本代码小结(比较常用)
2010/12/06 Javascript
JavaScript 反科里化 this [译]
2012/09/20 Javascript
jQuery中$.fn的用法示例介绍
2013/11/05 Javascript
jQuery之选项卡的简单实现
2014/02/28 Javascript
如何调试异步加载页面里包含的js文件
2014/10/30 Javascript
jQuery实现仿路边灯箱广告图片轮播效果
2015/04/15 Javascript
javascript中字体浮动效果的简单实例演示
2015/11/18 Javascript
JavaScript实现的鼠标响应颜色渐变效果完整实例
2017/02/18 Javascript
Js自动截取字符串长度,添加省略号(……)的实现方法
2017/03/06 Javascript
jQuery实现字体颜色渐变效果的方法
2017/03/29 jQuery
vue项目中导入swiper插件的方法
2018/01/30 Javascript
javascript原生封装一个淡入淡出效果的函数测试实例代码
2018/03/19 Javascript
jQuery 同时获取多个标签的指定内容并储存为数组
2018/11/20 jQuery
javascript实现计算指定范围内的质数示例
2018/12/29 Javascript
基于vue--key值的特殊用处详解
2020/07/31 Javascript
Linux下编译安装MySQL-Python教程
2015/02/02 Python
举例讲解Python的Tornado框架实现数据可视化的教程
2015/05/02 Python
python实现数独游戏 java简单实现数独游戏
2018/03/30 Python
服务器端jupyter notebook映射到本地浏览器的操作
2020/04/14 Python
python实现Oracle查询分组的方法示例
2020/04/30 Python
Python项目打包成二进制的方法
2020/12/30 Python
Lenox官网:精美的瓷器&独特的礼品
2017/02/12 全球购物
英国床和浴室商场:Bed & Bath Emporium
2018/05/20 全球购物
英国性能汽车零件和发动机配件在线:Maxpeedingrods
2019/11/05 全球购物
医学专业五年以上个人求职信
2013/12/03 职场文书
大学生饮食配送创业计划书
2014/01/04 职场文书
2014年电厂工作总结
2014/12/04 职场文书
八年级英语教学计划
2015/01/23 职场文书
事业单位个人总结
2015/02/12 职场文书
民事二审代理词
2015/05/25 职场文书
2016年村干部公开承诺书(公开承诺事项)
2016/03/25 职场文书
导游词之云南丽江-泸沽湖
2019/09/26 职场文书