meizz的专栏

梅花雪·疏影横斜

原创 javascript里的条件判断收藏

新一篇: javascript应用：实现复选框全选/全不选切换 | 旧一篇: 时间对象的格式化

    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里就不一定正确了。

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

发表于 @ 2005年11月30日 22:27:00|评论(loading...)|编辑

新一篇: javascript应用：实现复选框全选/全不选切换 | 旧一篇: 时间对象的格式化

评论

#chabulier 发表于2005-12-11 09:54:00  IP: 221.201.153.*
不错，辛苦了，这个东东值得咀嚼。
#Alan810 发表于2006-04-26 17:17:00  IP: 218.94.61.*
向高手学习！呵呵！解决了我常犯的错误！很有帮助哦！
#萨弗隆先驱者 发表于2006-10-19 15:39:00  IP: 221.221.9.*
有个疑问：

var s = "meizz";

如果不为空""的字符串为真，那么s就应该为真，但为什么s==true不为真呢？
#meizz 发表于2006-10-19 21:41:00  IP: 210.77.134.*
var s = "meizz";
//s==true

s 是字符串，而 true 属于布尔值，它们当然不会相等，但是在JS里作为判断条件来说，它有与 true 同等的判断结果，比如：

var s = "meizz";
if(s) alert("true");
#萨弗隆先驱者 发表于2006-10-20 00:20:00  IP: 221.217.168.*
明白了，多谢
#li_guang 发表于2006-12-19 14:21:13  IP: 218.19.62.*
向老大学习了
#lan_ting 发表于2007-01-17 08:20:02  IP:
学习了
#tz_xiong 发表于2007-08-27 19:36:39  IP: 202.106.86.*
写的很不错
#tyousan 发表于2007-09-06 17:56:37  IP: 58.246.25.*
看看这个为什么出错！~~~谢谢 看看哈
feifeixia2003@yahoo.com.cn


//this javaScript use in initing chinese province and

city select
//-------province--------------------------------------

------------------------------
var

province="00:ChoiceProvince|01:Shanghai|02:Beijing|03:Gu

angdong";
//-------city------------------------------------------

------------------------------
var

city="00000:ChoiceCity|01000:ChoiceCity|0121:Shanghai|02

000:ChoiceCity|0210:Beijing|";
city +=

"03000:ChoiceCity|0320:GuangZhou|03660:shanWei|03662:yan

gJiang|03663:Jieyang";
//-----------------------------------------------------

-----------------------------------------
//-----------init province-----------------------------

-----------------------------------------
function initProvince(){
var aprovince = province.split('|');
var oprovince = document.getElementById

('province');
initSel(aprovince,oprovince);
}
//-----------------------------------------------------

-----------------------------------------
//-----------init city---------------------------------

-----------------------------------------
function initCity(){
var v = document.getElementById

("province").value;
v = v.substring(0,2);

var aci
#tyousan 发表于2007-09-06 17:57:29  IP: 58.246.25.*

var acity =city.split('|');
var atemp=new Array();
for(k=0;k<acity.length;k++){
if(acity[k].substring(0,2)==v){
atemp.push(acity[k]);
}
}
var ocity=document.getElementById("city");
initSel(atemp,ocity);
}
//---------------------------------------------------------------------------------------
//-----------init select-----------------------------------------------------------------
function initSel(kvs,osel){
kvs.sort();
osel.length=0;
for(j=0;j<kvs.length;j++){
var v=kvs[j].substring(0,kvs[j].indexOf(":"));
var t=kvs[j].substring(kvs[j].indexOf(":")+1,kvs[j].length);

var ooption=document.createElement("option");
ooption.value=v;

var otext=document.createTextNode(t);
ooption.appendChild(otext);

osel.appendChild(ooption);
}
}
//------------------------------------------------------------------------------------------
//function by city value--------------------------------------------------------------------
function initSelByCV(cv){
var osp = document.getElementById("province");
var osc = document.getElementById("city");
var pv = cv.substring(0,2);
selectOption(osp,pv);
initCity();
selectOption(osc,cv);
}
fu
#tyousan 发表于2007-09-06 17:59:09  IP: 58.246.25.*
上面夫fu去掉，接下面
function selectOption(os,v){
for(var i=0;i<os.options.length;i=i+1){


if(os.options[i].value==v){
//alert(os.options[i].value);
os.options[i].selected=true;
break;
}
}
}
//--------------------------------------------------------------------------------------
function initPC(){
var cv = "0320" ;
initSelByCV(cv);
}
#tyousan 发表于2007-09-06 17:59:30  IP: 58.246.25.*
<html>
<head>
<title>Test</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=gb2312">

<script language="javascript" src="E:\AreaTool.js"></script>

</head>

<body>
<select id="province" name="province" onchange="initCity();" style="width:100px">
</select>
<select id="city" name="city" style="width:100px">
</select>
<script language="javascript">
document.body.onload=function(){
initProvince();
initCity();
initPC();
}
</script>
</body>
</html>
发表评论  


当前用户设置只有注册用户才能发表评论。如果你没有登录，请点击登录
Csdn Blog version 3.1a
Copyright © meizz