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)完全等价”
Javascript的一些技巧(《Javascript DOM编程艺术》、Javascript语言精粹)的更多相关文章
- JavaScript DOM 编程艺术 ---> JavaScript语法
二. JavaScript语法目录 2.1 语法 javaScript代码要通过HTML/XHTML文档才能执行.可以有两种方式完成这一点,第一种是将JavaScript代码放到文档<head ...
- JavaScript DOM 编程艺术·setInterval与setTimeout的动画实现解析
先贴上moveElement()函数的大纲,为了方便观看,删了部分代码,完整版粘到文章后面. function moveElement(elementID,final_x,final_y,interv ...
- 《javascript dom编程艺术》笔记(一)——优雅降级、向后兼容、多个函数绑定onload函数
刚刚开始自学前端,如果不对请指正:欢迎各位技术大牛指点. 开始学习<javascript dom编程艺术>,整理一下学习到的知识.今天刚刚看到第六章,记下get到的几个知识点. 优雅降级 ...
- JavaScript DOM编程艺术读后感(1)—— 平稳退化
最近,在读<JavaScript DOM编程艺术(第二版)>这本书,想着将自己的读后感记录下来,作为记忆吧. 其实我并不是最近才刚开始读这本书的,我读了有一段时间了.我是一名web前端开发 ...
- 读书笔记:JavaScript DOM 编程艺术(第二版)
读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...
- JavaScript DOM编程艺术学习笔记(一)
嗯,经过了一周的时间,今天终于将<JavaScript DOM编程艺术(第2版)>这本书看完了,感觉受益匪浅,我和作者及出版社等等都不认识,无意为他们做广告,不过本书确实值得一看,也值得推 ...
- JavaScript DOM编程艺术第一章:JavaScript简史
本系列的博客是由本人在阅读<JavaScript DOM编程艺术>一书过程中做的总结.前面的偏理论部分都是书中原话,觉得有必要记录下来,方便自己翻阅,也希望能为读到本博客的人提供一些帮助, ...
- 《JavaScript dom 编程艺术》 placeholder占位符IE8兼容办法。
在<JavaScript dom 编程艺术>第11章学来的. 相对于用JavaScript替换文本框的提示语句 <!DOCTYPE html> <html lang=&q ...
- 《JavaScript DOM 编程艺术》
前几天京东买了一本书,在豆瓣上好评如潮,买下了啃一啃,书名<JavaScript DOM 编程艺术>,在好好深造一下javaScript.一边啃,一边敲.当然应该要做好笔记.一些简单的就看 ...
- 《JavaScript Dom 编程艺术》读书笔记-第4章
我的前端入门第一本书是<JavaScript Dom 编程艺术>,网上查找资料发现前端的入门推荐书籍最受好评的就是这本和<JavaScript 高级程序设计>了.之所以先选这本 ...
随机推荐
- [转] ASPNET Core 中获取应用程序物理路径
如果要得到传统的ASP.Net应用程序中的相对路径或虚拟路径对应的服务器物理路径,只需要使用使用Server.MapPath()方法来取得Asp.Net根目录的物理路径,如下所示: // Classi ...
- Python学习系列之异常处理
什么是异常处理 python内置了一套try···except···finally的错误处理机制 当程序出错的时候进行捕捉,然后根据捕捉到的错误信息进行响相应的处理 常用的内建异常 初识异常处理 如例 ...
- 006 Cisco switch prewired
Switch>en Switch#config t Enter configuration commands, one per line. End with CNTL/Z. Switch(co ...
- hadoop的linux配置
一.新建hadoop组跟用户(password:hadoop) [root@localhost home]# groupadd hadoop [root@localhost home]# userad ...
- CSS (二)解析CSS盒子
话说.一写博客还有些莫名的兴奋感-- 这几天一直挤时间忙于赶牛腩视频,迟到的CSS盒子.请谅解. CSS盒子,一開始听起来还有点高大上的赶脚. 后来了解之后,发现事实上非常easy理解.从功能上讲非常 ...
- UML图与机房收费系统实例
前言 通过看视频,对于UML也有了一些初步的了解.前面也介绍了UML的三个基本块.规则和机制,只是这些东西就像是一个个机器的零部件.要组合起来才干发挥作用. 所以,实例才是验证自己学习好坏标准,以下我 ...
- powershell 的版本号所引起的载入 FSharp 编译器问题
powershell 的版本号所引起的载入 FSharp 编译器问题 在 64 位的系统下,大部分系统文件都有 64 位和 32 位的版本号:通常在C:\WINDOWS\system32 下的是 64 ...
- HDU1864_最大报销额(背包/01背包)
解题报告 pid=1864">题目传送门 #include <cstdio> #include <cstring> #include <iostream& ...
- java poi excel导入模板设置下拉框
import org.apache.poi.hssf.usermodel.DVConstraint; import org.apache.poi.hssf.usermodel.HSSFCell; im ...
- 基本数据类型操作的补充和set的基本操作
1,补充基本数据类型的知识点: " " .join(内容)...........什么加到什么里边,内容可以是:int,str,dic,tup. lst = ["周 ...