您的位置:首页 > Web前端 > JavaScript

JS中对象和变量是否可以作为if选择结构的条件?

2013-12-12 03:07 671 查看
由于JS很菜,工作中看别人写的js代码,发现很多都是自己没见过没想过的。有段时间发现别人把一个方法或者对象作为if选择结构的条件,感到很疑惑?方法和对象也可以作为if选择结构的条件吗?

然后一直想去验证,但是都很懒,没去行动;有一天去测试过了,当时是明白这些是不是可以作为if选择结构,但是过了一段时间后,发现自己又把这些验证过的东西给忘了,记不起来了。

所以今晚又来测试一下js中方法和对象是不是可以作为if选择结构的条件,并且把测试结果记录下来。古人言:好记性不如烂笔头。此话诚不欺我也!

测试开始了:

html页面中有一个标签:<input type="button" id="btnIf" onclick="TestIf()" value="测试if结构" />

下面是js测试代码:

function TestIf() {

var btn = document.getElementById("btnIf"); //存在该对象

var btn0 = $("#btnIf"); //jQuery获取存在的对象

var btn2 = document.getElementById("btnIf2"); //不存在该对象

var btn3 = $("#btnIf2"); //jquery获取不存在的对象

try {//用来验证js和jQuery分别获取不能再的对象,然后调用对象的属性会不会报错

var btnResult = btn.innerHTML;

var btn3Result = btn3.val();

} catch (e) {//没有进入catch

alert(e.Message+",报错了");

}

try {

var btn2Result = btn2.innerHTML;//js获取不存在的对象,调用它的属性会报异常,而jqeury获取不存在的对象不会报异常

} catch (e) {//进入catch

alert("js获取不存在的对象调用对象属性果然会报错!--》 "+e.Message);

}

//测试js和jQeury获取的不存在的对象能否用对象的属性

try {

var btn2Value = btn2.innerHTML;

} catch (e) {//进入catch,报错

alert("js获取的不存在的对象不能调用属性 -- 》 "+e.Message);

}

try {

var btn3Value = btn3.val();

} catch (e) {//没有进入catch,说明jQuerry获取不存在的对象调用对象属性不会报错

alert("jquery获取的不存在的对象不能调用属性--- > "+e.Message);

}

var str1; var str2 = null, str3 = "", str4 = undefined; str5 = "nihao";

if (btn) {

alert('Id为btnIf的对象存在'); //if跳入这里

} else if(!btn){

alert('Id为btnIf的对象不存在');

}

if (btn0) {

alert("jQuery获取存在的对象可以作为if选择条件"); //跳入这里

} else if(!btn0) {

alert("jQuery获取存在的对象不可以作为if选择条件");

}

if (btn2) {

alert('Id为btnIf2 的对象存在');

} else if(!btn2){

alert('Id为btnIf2 的对象不存在'); //结果跳入这里,false

}

if (btn3) {

alert("jQuery获取不存在的对象可以作为if选择条件"); //结果跳入这里,jqeury获取的对象就算不存在,作为if选择结构条件时也是为true

} else if (!btn3) {

alert("jQuery获取不存在的对象不可以作为if选择条件");

}

alert('btn2==undefined---》 ' + (btn2 == undefined) + ' , btn2==null--》' + (btn2 == null)

+ "\nbtn==true -- > " + (btn == true) + "\nbtn0==true -- > " + (btn0 == true) +

"\nbtn3==true -- > "+(btn3==true)+"\nbtn2==true -- > "+(btn2==true));//结果对象==true的结果都是false

if (str3) {//str3==""

alert('str3=""存在');

} else if(!str3) {

alert('str3=""不存在');//进入这里

}

if (str1) { //str1=undefined -->跳入str1不存在

alert('str1存在');

} else if(!str1) {

alert('str1不存在。。');//进入这里

}

str1 = function () { } //赋值

if (str1) { //str1为一个构造函数,应该跳入str1存在

alert('str1存在');

} else if(!str1) {

alert('str1不存在');

}

if (str5) {

alert("str5=nihao 可以作为if条件"); //进入这里

} else if (!str5) {

alert("str5=nihao不可以作为if条件");

}

var str6 = " "; //空格

if (str6) {

alert("空格可以作为if条件");

} else if (!str6) {

alert("空格不可以作为if条件");

}

var str7 = null, str8 = "", str9 = undefined;

alert("str5==true -- >" + (str5 == true) + "\nstr8==true --> "

+ (str8 == true) + "\nstr9==true --> " + (str9 == true));//结果都是false,很奇怪;按理来说既然既然str5可以作为if条件,那么和true相比应该是true才对,事实不是如此

}

现在把刚才的测试结果统计一下:

1、js获取的存在的对象、jQuery获取存在或者不存在的对象、赋值不为空(可以为空格,不能是‘’或者“”)、方法都可以作为 if 选择结构的条件。即把他们作为 if 条件都能进入if大括号里面

2、js获取的不存在对象、变量为null 或者 为 undefined、或者变量为‘’ 或者 “” 不能作为 if 选择结构的条件;表现有点类似false了

3、这些对象、变量、方法和布尔类型比较都是false,比如 var str="nihao"; 这个str变量作为 if 选择结构的条件表现为true,可以进入 if 选择结构,但是str==true 的结果为false

4、js获取不存在对象,调用该对象的属性,会报错,异常;而jQuery获取的不存在的对象,调用该对象的属性不会报错报异常。

5、jQuery获取的对象不管该对象是否存在,它作为 if 条件都会为true,这就没什么意义了。所以如果想把jQuery获取的对象作为if判断条件,即想判断该对象是否存在,则可以用对象.length这个属性来判断,对象存在则调用length属性返回的值至少为1(表示存在一个对象,大于1就表示有多个对象存在),对象不存在则length结果为0

暂时只测到这里了,路漫漫其修远兮,我将上下而求索,加油吧,路还有很远!
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: