javascript里的条件判断


Posted in Javascript onFebruary 27, 2007

JavaScript 是一种可以在浏览器中运行的脚本语言,是一种弱语言(相对于C,C#,JAVA而言),只要是计算机语言就会使用到条件判断式,而JavaScript作为一种“弱”语言,它的条件判断常常令人困惑不解,特别是有其它强语言编程经历的人来说,更是不可理喻!高手和无惑的人别取笑,我自己也曾经有一段时间郁闷过。先写一个例子吧:

var s = "meizz";
if (s && s==true)
{
    alert("Is true");
}

    咱先不管上面的代码运行的结果正确与否,我给变量 s 赋的是字符型,而在后面的 if 条件判断式里是直接把变量 s 作为一个判断表达式写出的,若是在强语言里对字符型的变量要么是判断它的类型是否是字符型或者是判断这个变量的值是否等于某字符串,但在 javascript 里就是没有用类型判断(typeof)也没有值判断(==)而就是这么孤伶伶地在那里,就可以作为一个条件判断表达式。当然这种单独作为条件表达式不只是字符型变量,也可以是数字型变量,也可以是一个对象,也可以是一个函数或者方法等等。这就正是这种语法令人费解的地方。

    我测试统计了一下:在 JavaScript 里,不为空 "" 的字符串、不为 0 的数字、不为 null 的对象、不为 undefined 的对象属性、布尔型 true,单独作为判断式里的一个表达式时 JavaScript 通通认定为真(true),反之则为假(false)。

    原因为是JS脚本没有强变量类型,你前一句赋值 var s = "meizz"; 后一句你甚至马上可以写成 s = function(){}; ,中间没有任何的类型转换,而这些写法在强语言里是不可思议的,甚至是大逆不道的(根本就不支持这种语法),但在JS脚本里却是那么的自然。原因就是没有强制变量类型, 变量类型是动态的,也就是说变量本身是没有类型的,变量的值是有类型的。呵呵,这里扯到其它模块去了,嗯,关于变量类型我另外再写文章讨论吧。

    说到这里,就不难理解 if (s && .....这句的判断式了,同样的道理,我甚至可以 function s(){} 然后再用 if (s && .... 或者 var s = document.getElementById("ObjectId");  if (s && .... 这样语法在JS脚本里都是没错的,至于判断的结果可以参考上面的那段统计结果。

    现在再来讨论上面的那几句代码的运行结果,多个条件判断式的结果合成运行只有“与”和“或”,到于“非”因为它是一元运行符,只针对单个值,比如 if (!s) ... 至于条件式不只一个的时候条件式的结果只有与和或的运行。与(&&),或(||)。上面的那句条件式:if (s && s==true) 就是两个条件式的合成判断。至于与运算(只要一个值为false则值为false)或运算(只要一个值为true则值为true)这些运算细节我就不多说了,教科书比我的笔头强多了。现在来分析这个判断式:这是一个“与”运算。第一个判断式 s ,因为它的字符型值不为 "" ,在JS当然认为它等同于 true,第二个判断式是 s==true,显然这个不相等,值为 false,因为是“与”运算,当然整个条件判断式的结果是 false,所以不会运行 alert()。

    第三,我这里说说几个很特殊的条件判断。在没有任何声明(var)和赋值的情况下,直接拿一个变量来判断JS会抛出一个变量未定义的错误出来。比如:

if (ss) alert("条件判断结果为 true!");

运行这句代码就会出错。因为这个变量 ss 从未被声明赋值过,这种情况不等同于上述的 null "" undefined。这种情况一般会发生在什么地方呢?一是自己写代码不小心未声明,二就是对网页里没有的控件进行操作直接用ID来操作的时候,比如 if (InputId.value!="") ... ,若是网页里根本就没有 id="InputId" 的文本框或者在执行这句脚本操作的时候这个文本框还没有被浏览器加载,那也就抛出变量未定义的错误。

    结果的办法是:第一种情况用 typeof 判断。if (typeof(ss)=="undefined") alert("变量未定义");  ,第二种情况则不要直接使用ID来引用对象而使用标准的对象引用。例:

var e = document.getElementById("InputId");  //IE里以前是用 document.all.InputId
if (e && e.value!="") ;//...... 

这样就不会出这种错误了。

那么就上面这句代码有人会说一定要这样写呢,为什么不直接 

if(document.getElementById("InputId").value != "") ;//....

这样的代码不是更精练吗?城然代码是精简了,但错误也来了。只要网页里没有这个对象或者这个对象在脚本执行的时候还未被加载到,就会报错。原来是 document.getElementById("InputId") 返回了 null 值,而 null 显然是没有 value 属性的,而我那句代码也用到了 e.value 来取属性但就没有报错,原因在于C系列的语言在多个条件式里的另一外属性:多个条件判断式组合判断时,先看第一个条件式,若已经符合条件时,就不会再去判断第二个判断式;也就是在第一个条件判断式未达到标准时再会去判断第二个判断式,依此类推直至最后。if (e && e.value!="") 是两个判断式的组合判断,这是一个“与”运算,只要一个判断式为 false 则整个值都为 false。第一个判断式 e 由于不存在或者未加载到返回了 null,而在JS里 null 就等同于 false ,这样不用后面的判断也可得到整个组合判断的结果是 false 了,所以系统就不会再去判断后面的那句 e.value 了。这点与B系列语言不同,尤其要注意。在B语言中 if e and e.value!="" then 这样的语句是先把所有的判断式都运算一遍后最后再做组合的“与”运算。所以这句代码在JS里是正确的,若放在VBS里就不一定正确了。

    好了,肚里的货不多,文笔又比较烂,就写这么多了,望大家多多指正!

Javascript 相关文章推荐
基于jquery的jqDnR拖拽溢出的修改
Feb 12 Javascript
根据经纬度计算地球上两点之间的距离js实现代码
Mar 05 Javascript
JavaScript实现多维数组的方法
Nov 20 Javascript
javascript函数作用域学习示例(js作用域)
Jan 13 Javascript
jquery+html5制作超酷的圆盘时钟表
Apr 14 Javascript
关于JS中的方法是否加括号的问题
Jul 27 Javascript
利用JavaScript阻止表单提交的两种方法
Aug 11 Javascript
AngularJS自定义表单验证功能实例详解
Aug 24 Javascript
自己动手封装一个React Native多级联动
Sep 19 Javascript
vue项目中使用scss的方法步骤
May 16 Javascript
vant 解决tab切换插件标题样式自定义的问题
Nov 13 Javascript
用vue设计一个日历表
Dec 03 Vue.js
javascript第一课
Feb 27 #Javascript
javascript编程起步(第三课)
Feb 27 #Javascript
javascript编程起步(第二课)
Feb 27 #Javascript
javascript编程起步(第五课)
Feb 27 #Javascript
javascript编程起步(第四课)
Feb 27 #Javascript
javascript编程起步(第六课)
Feb 27 #Javascript
javascript编程起步(第七课)
Feb 27 #Javascript
You might like
详解WordPress开发中get_header()获取头部函数的用法
2016/01/08 PHP
PHP strcmp()和strcasecmp()的区别实例
2016/11/05 PHP
PHP简单获取随机数的常用方法小结
2017/06/07 PHP
PHP strripos函数用法总结
2019/02/11 PHP
PHP序列化和反序列化深度剖析实例讲解
2020/12/29 PHP
Jquery Ajax的Get方式时需要注意URL地方
2011/04/07 Javascript
浅谈JavaScript编程语言的编码规范
2011/10/21 Javascript
JavaScript高级程序设计 阅读笔记(四) ECMAScript中的类型转换
2012/02/27 Javascript
Jquery通过Ajax访问XML数据的小例子
2013/11/18 Javascript
javascript轻量级模板引擎juicer使用指南
2014/06/22 Javascript
jQuery-1.9.1源码分析系列(十一)DOM操作续之克隆节点
2015/12/01 Javascript
jQuery获取选中单选按钮radio的值
2016/12/27 Javascript
JS实现仿UC浏览器前进后退效果的实例代码
2017/07/17 Javascript
JavaScript实现五子棋游戏的方法详解
2019/07/08 Javascript
Preload基础使用方法详解
2020/02/03 Javascript
[01:06:39]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#1Liquid VS Alliance第三局
2016/03/02 DOTA
centos系统升级python 2.7.3
2014/07/03 Python
详解Python3 中hasattr()、getattr()、setattr()、delattr()函数及示例代码数
2018/04/18 Python
python2 与 pyhton3的输入语句写法小结
2018/09/10 Python
python实现彩色图转换成灰度图
2019/01/15 Python
Python面向对象程序设计之类的定义与继承简单示例
2019/03/18 Python
Python Threading 线程/互斥锁/死锁/GIL锁
2019/07/21 Python
python通过matplotlib生成复合饼图
2020/02/06 Python
python异常处理、自定义异常、断言原理与用法分析
2020/03/23 Python
如何将json数据转换为python数据
2020/09/04 Python
HTML5自定义data-* data(obj)属性和jquery的data()方法的使用
2012/12/13 HTML / CSS
SmartBuyGlasses英国:购买太阳镜和眼镜
2018/01/29 全球购物
Joie官方网上商店:购买服装和女装配饰
2018/06/05 全球购物
介绍一下sql server的安全性
2014/08/10 面试题
《菜园里》教学反思
2014/04/17 职场文书
赤壁观后感(2)
2015/06/15 职场文书
《成长的天空》读后感3篇
2019/12/06 职场文书
Golang 实现获取当前函数名称和文件行号等操作
2021/05/08 Golang
关于python中readlines函数的参数hint的相关知识总结
2021/06/24 Python
Python类方法总结讲解
2021/07/26 Python
Java多线程并发FutureTask使用详解
2022/06/28 Java/Android