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

时间:2021-06-03 03:07:50

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)完全等价”

Javascript的一些技巧(《Javascript DOM编程艺术》、Javascript语言精粹)的更多相关文章

  1. JavaScript DOM 编程艺术 ---&gt&semi; JavaScript语法

    二.  JavaScript语法目录 2.1 语法 javaScript代码要通过HTML/XHTML文档才能执行.可以有两种方式完成这一点,第一种是将JavaScript代码放到文档<head ...

  2. JavaScript DOM 编程艺术&&num;183&semi;setInterval与setTimeout的动画实现解析

    先贴上moveElement()函数的大纲,为了方便观看,删了部分代码,完整版粘到文章后面. function moveElement(elementID,final_x,final_y,interv ...

  3. 《javascript dom编程艺术》笔记(一)——优雅降级、向后兼容、多个函数绑定onload函数

    刚刚开始自学前端,如果不对请指正:欢迎各位技术大牛指点. 开始学习<javascript dom编程艺术>,整理一下学习到的知识.今天刚刚看到第六章,记下get到的几个知识点. 优雅降级 ...

  4. JavaScript DOM编程艺术读后感(1)—— 平稳退化

    最近,在读<JavaScript DOM编程艺术(第二版)>这本书,想着将自己的读后感记录下来,作为记忆吧. 其实我并不是最近才刚开始读这本书的,我读了有一段时间了.我是一名web前端开发 ...

  5. 读书笔记:JavaScript DOM 编程艺术(第二版)

    读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...

  6. JavaScript DOM编程艺术学习笔记(一)

    嗯,经过了一周的时间,今天终于将<JavaScript DOM编程艺术(第2版)>这本书看完了,感觉受益匪浅,我和作者及出版社等等都不认识,无意为他们做广告,不过本书确实值得一看,也值得推 ...

  7. JavaScript DOM编程艺术第一章:JavaScript简史

    本系列的博客是由本人在阅读<JavaScript DOM编程艺术>一书过程中做的总结.前面的偏理论部分都是书中原话,觉得有必要记录下来,方便自己翻阅,也希望能为读到本博客的人提供一些帮助, ...

  8. 《JavaScript dom 编程艺术》 placeholder占位符IE8兼容办法。

    在<JavaScript dom 编程艺术>第11章学来的. 相对于用JavaScript替换文本框的提示语句 <!DOCTYPE html> <html lang=&q ...

  9. 《JavaScript DOM 编程艺术》

    前几天京东买了一本书,在豆瓣上好评如潮,买下了啃一啃,书名<JavaScript DOM 编程艺术>,在好好深造一下javaScript.一边啃,一边敲.当然应该要做好笔记.一些简单的就看 ...

  10. 《JavaScript Dom 编程艺术》读书笔记-第4章

    我的前端入门第一本书是<JavaScript Dom 编程艺术>,网上查找资料发现前端的入门推荐书籍最受好评的就是这本和<JavaScript 高级程序设计>了.之所以先选这本 ...

随机推荐

  1. JAVA多线程(一)

    进程与线程: 一个进程可以包含多个线程.多个线程可以并行,但是一个时间点只能有一个线程是运行状态. 线程的状态: 查看API可以,线程的状态分为五种: (JVM里面的状态:These states a ...

  2. poj2778DNA Sequence(AC自动机&plus;矩阵乘法)

    链接 看此题前先看一下matrix67大神写的关于十个矩阵的题目中的一个,如下: 经典题目8 给定一个有向图,问从A点恰好走k步(允许重复经过边)到达B点的方案数mod p的值    把给定的图转为邻 ...

  3. IOS学习之路七&lpar;使用 Operation 异步运行任务&rpar;

    在 application delegate 头文件(.h)中声明一个 operation 队列和两个 invocation operations: #import <UIKit/UIKit.h ...

  4. &lbrack;BS-23&rsqb; AFN网络请求上拉&sol;下拉刷新的细节问题总结

    上拉/下拉刷新的细节问题总结 1.如果导航栏有透明色,则也需要设置header自动改变透明度 self.tableView.mj_header.automaticallyChangeAlpha = Y ...

  5. 1037&colon; &lbrack;ZJOI2008&rsqb;生日聚会Party - BZOJ

    Description 今天是hidadz小朋友的生日,她邀请了许多朋友来参加她的生日party. hidadz带着朋友们来到花园中,打算坐成一排玩游戏.为了游戏不至于无聊,就座的方案应满足如下条件: ...

  6. 应用程序中小红点设置方法 (ios)

    我们的手机上常常会看到软件的右上角出现小红点,上面显示着你未读的消息数.下面是设置小红点的方法. 1.tabBar上按钮的小红点      因为小红点代表你未读的消息数,所以这个小红点上的数据不是凭空 ...

  7. KVO初探

    一,概述 KVO,即:Key-Value Observing,它提供一种机制,当指定的对象的属性被修改后,则对象就会接受到通知.简单的说就是每次指定的被观察的对象的属性被修改后,KVO就会自动通知相应 ...

  8. java基本类型和数字类及其相关计算

    --- java 八大基本类型 byte  short int long double float boolean char --对应的包装类 Byte Short Integer Long Doub ...

  9. java中的Iterator和ListIterator的区别

    (一)iterator迭代器 Collection的iterator方法返回一个实现了一个Iterator接口的对象 Iterator接口中包含三个方法: 1)E next() 2)boolean h ...

  10. OCM&lowbar;第十三天课程:Section6 &mdash&semi;》数据库性能调优 &lowbar;结果缓存 &sol;多列数据信息采集统计&sol;采集数据信息保持游标有效

    注:本文为原著(其内容来自 腾科教育培训课堂).阅读本文注意事项如下: 1:所有文章的转载请标注本文出处. 2:本文非本人不得用于商业用途.违者将承当相应法律责任. 3:该系列文章目录列表: 一:&l ...