Javascript的一些技巧（《Javascript DOM编程艺术》、Javascript语言精粹）

1.什么时候用布尔变量当变量

假设你需要一个这样的变量：我在睡觉——存为一个值；我没在睡觉——存为另一个值。

一般的做法：

var stateOne="睡觉"，stateTwo="没睡觉";

更好的做法：

var sleeping="true";

这种做法的本质是利用布尔类型的性质，用一个变量来区分两种状态（睡觉用true，没睡用false）——如果你的目地不是区分状态而是这两个状态代表的值，不能用这个办法。

例子：

1.目地是两个状态代表的值：本文的“2.用对象来存储数据时，书写的代码顺序”里的gender对象，虽然也是要区分两种状态（男或者女），但是目地是要把男/女作为字符串用在其它变量中进行拼接，所以不能用布尔值。

2.目地是区分两个状态：

 

2.用对象来存储数据时，书写的代码顺序 

 

//记录学生的电话号码、家庭住址、邮箱，并且分男女存放（但经常取出的数据是不需要分男女的）。
var student = {};
student.phone = {};
var gender = {m:"male ",f:"female "};
student.phone.male = {Lei_li:gender.m + "001 ",Ming_wang:gender.m + "010 "};
student.phone.female = {Hong_xiao:gender.f + "001 ",Li_xiao:gender.f + "010 "}

student.address = {};
var country = {cn:"China ",en:"England "}
student.address.male = {Lei_li:gender.m + country.cn + "yunnan ",Ming_wang:gender.m + country.en + "london "};
student.address.female = {Hong_xiao:gender.f + country.cn + "yunnan ",Li_xiao:gender.f + country.en + "london "};

student.mail = {};
var mailType = {qq:"@qq.com ",outLook:"@outlook.com "};
student.mail.male = {Lei_li:gender.m + "liLei" + mailType.qq,Ming_wang:gender.m + "wangMing" + mailType.outLook};
student.mail.female = {Hong_xiao:gender.f + "xiaoHong" + mailType.qq,Li_xiao:gender.f + "xiaoLi" + mailType.outLook};
alert(student.mail.male.Ming_wang);
//思考的时候可以选择自顶向下或自底向上，但写的时候只能是“自底向上”地写。
//用到变量的时候再声明，这有利于阅读。
//如果拼接的字符串之间需要空格，就要在字符串变量最后加个空格（不需要就不加）——同理，最后一个字符串变量也加个空格。

 

3.形如year = 2010与year = "2010"的区别与应用。

其实是在问，变量要设为数字还是字符串？一般来说设为数字最好：

/*
这里的变量year既可以通过+=操作符变成字符串参与文本显示，又可以用于数值计算——比如根据网络时间，过一年自动进行year + 1，如果year是字符串就没办法做到这一点了。
*/
var year = 2018;
var message = "The year is ";
message += year;
alert(message);

 

4.从阅读上考虑，什么时候用"<"？什么时候用">"？

//有"&&"的情况下，这样写更接近"1 < test < 5"，更易读。
var test = 2;
if(1 < test && test < 5){
    alert("Is true");
}
else{
    alert("Is false");
}

//有"||"的情况下，把变量放在同一边，可以更直观看出哪个是"小于"哪个是"大于"；同时也让数字"-1"和"5"从左到右排列。
var test = -2;
if(test < -1 || test > 5){
    alert("Is true");
}
else{
     alert("Is false");
}

//数字从左到右、从小到大排列，更易读。
if( !(1 < 2) ){
    alert("Is true");
}
else{
    alert("Is false");
}

 其实这不需要考虑那么多，毕竟这只是简单的逻辑，这都看不懂是不可能的。所以这一条只能说是个人的风格。

 

4.值为null的变量在转换为布尔值后完全等价于false

var test_items = document.getElementsByTagName("p");
for(var i = 0 ; i < test_items.length ; i++){
    var test_title = test_items[i].getAttribute("title");
    //对于if判断语句，值为null的在转换为布尔值时就是false，所以这里可以直接写成if（test_title）{}
    if( test_title != null ){            
        alert( test_title ); 
    }
}

 原文：“当检查某项数据是否是null值时，我们其实是在检查它是否存在.....if（something）与if（something ！= null）完全等价”