Javascript 学习书 推荐


Posted in Javascript onJune 13, 2009

Aaron Gustafson著,李松峰 李雅雯 等译。感觉绝对是一本值得看的书。感兴趣的朋友可以看一下。下面是我从其中抽出来的javascript常见陷阱和对象的概念整理出来的。希望对大家能有一些帮助。

Ø Javascript语法中常见的陷阱

² 区分大小写

² 单引号和双引号实际上是没有特殊的区别的,这点我是从看了这本书才开始真正的知道,虽然在以前写程序时写过‘'号的字符串形式,但是却没有先觉性的发现“哦,原来这样也可以。”

另外大多数情况下还都是用‘'来表示字符串的,因为XHTML规范要求所有XHTML属性值都用“”括起来。这样混合代码时会很清晰。

² 换行,千万不要忽略这一点。因为如果在一个字符串中你用了回车做换行那么对不起了,浏览器会告诉你我不认识你的字符串。因为它会自动将回车转换成”;“但是为了解决这个问题,还好它提供了一个转义字符作为替代。如下所示:

var='<h2 class=”a”>A list</h2>\

<ol>\

<li class=”a”></li>\

</ol>'

有人会说可以用加号的,这些我知道。用加号作为字符串的操作符。估计是底层进行了+号的重载(?!)。

² 可选的分号和花括号

如果你不相信,我告诉你这是可以的。可以说这点javascript做的还是比较智能的。但是和前述那本书作者一样,我想我们做程序员还是规规矩矩些比较好。

² 重载

有时候或许你会突发奇想曲做一个javascript的重载函数,你会发现这时候竟然只有最后一个可以运行,前面的都没有得到录用机会。这是什么原因呢?

原来,先前的某某已经被后面的给替换掉了。也就是通常说的覆盖。再进一步说就是程序只引用作用域链中的最后一个同名函数。

² 匿名函数

不得不说这个家伙很有用。

² 作用域解析和闭包

这个作用域相信大家都比较熟悉,因为每个编程语言都有这样的概念。

而作用域链是用来描述一种路径的属于,沿着该路径可以确定变量的值(或者当函数被调用时要使用的方法)

闭包是与作用域相关的一个概念,它指的是内部函数即使在外部哈数执行完成并终止以后,仍然可以访问其外部函数的属性。当引用一个变量或方法时,javascript会沿着由对象执行路径构成的作用域链进行解析,查找变量最近定义的值。一旦找到,即使用该值。

² 迭代对象

不要怀疑这用的不好的话,很可能会产生错误。不信就看这一个例子:

var all=document.getElementsByTagName(‘*');

for(i in all){

//对all[i]元素进行操作。

}

由于返回的会分别等于length、item和namedItem,而这个很可能会导致代码中出现意外错误。

这时要做一下处理。用hasOwnProperty进行属性过滤,这个函数在对象的属性或方法是非继承的时返回true。方法如下:

var all=document.getElementsByTagName(‘*');

for(i in all){

if(!all.hasOwnProperty(i)){continue;}

//对all[i]元素进行操作。

}

² 函数的调用和引用。

注意了,这是不同的,调用会执行,引用只会给变量一个copy(好像可以这样理解吧?)

看下这个:

var foo=exampleFunction();

var foo=exampleFunction;

这两句式不一样的。前一个是执行exampleFunction这个函数并将返回值赋给变量foo,而后一个却是将exampleFunction这个函数的引用赋给foo。

Ø Javascript对象

属性和方法的概念相信大家都晓得。下面讲下javascript中的对象和其中的玄奥妙义(讲的跟武侠似的)。

1. 继承

Javascript的继承让我很奇怪,但是想过之后感觉还是有道理的。而且和其他的还是一样的思想。其实javascript就是做了一个复制的操作。闲话不说看一个例子相信大家都会清楚了。

//创建一个person对象的实例

var person={};

person.getName=function(){……};

person.getAge=function(){……};

//创建一个employee对象的实例

var employee={};

employee.getTitle=function(){……};

enployee.getSalary=function(){……};
//从person对象中继承方法

employee.getName=person.getName;

employ.getAge=person.getAge;

2. 创建自己的对象

有两种方式可以创建自己的对象:

第一种:var myObject =new Object();

第二种:var myObject={};//是第一种的简写形式。实际上面已经用到了。

3. 创建构造函数

第一种:function myConstructor(a){

//代码

}

不要惊讶,想象前面说的javascript中到处都是对象,虽然有些夸张。这个函数一时一个对象。

第二种:

或许聪明的读者已经猜出来了,就是函数定义的另外两种类型:

var myConstructor=function(a){};

第三种也一起写出来吧:var myConstructor=new Function(‘a',/*某些代码*/);

不过对于这种方式,因为会导致性能问题,所以还是用function比较妥当。

最后给个书中的例子:

function myConstructor(message){

alert(message);

this.myMessage=message;

}

var myObject =new myConstructor(‘Instantiating myObject!');

4. 添加静态方法

var myObject={};

//添加属性

myObject.name=”Jeff”;

//添加方法

myObject.alertName=function(){

alert(this.name);

}

//执行方法

myObject.alertName();

相信大家都能看明白,不说了。

5. 想原型中添加公有方法

添加公有方法的方式是用prototype,注意这里的prototype可不是那个js库。

//创建构造函数

function myConstructor(message){

alert(message);

this.myMessage=message;

}

//添加一个公有方法

myConstructor.prototype.clearMessage=function(string){

this.myMessage+=''+string;

}

这里面要提的一点是 构造函数中凡是以var开头的变量全部是私有变量,不是以.号和prototype添加而是直接写入构造函数中的为私有函数。

6. 最后提一下对象字面量

对象字面量对于代码的重构,冗余度的减小都很有帮助。所以如果可能的话最好用这种

看下下面的例子:

var myObject={

propertyA:'value',

propertyB:'value',

methodA:function(){}

}

不得不同意作者的观点,这种方式很优雅。

怎么样?是不是对Javascript中的对象和陷阱有了一些基本的认识?希望这篇文章对你有所帮助。

Javascript 相关文章推荐
Javascript 获取链接(url)参数的方法
Feb 15 Javascript
ExtJS TabPanel beforeremove beforeclose使用说明
Mar 31 Javascript
一个基于jQuery的树型插件(OrangeTree)使用介绍
May 03 Javascript
利用JS判断用户是否上网(连接网络)
Dec 23 Javascript
jquery中EasyUI实现同步树
Mar 01 Javascript
JavaScript通过Date-Mask将日期转换成字符串的方法
Jun 04 Javascript
jQuery EasyUi实战教程之布局篇
Jan 26 Javascript
js实现简单的手风琴效果
Feb 27 Javascript
Vue.js+Layer表格数据绑定与实现更新的实例
Mar 07 Javascript
详解Vue项目部署遇到的问题及解决方案
Jan 11 Javascript
Vue.extend 编程式插入组件的实现
Nov 18 Javascript
vue3.0生命周期的示例代码
Sep 24 Javascript
javascript 框架小结 个人工作经验
Jun 13 #Javascript
动态刷新 dorado树的js代码
Jun 12 #Javascript
firefo xml 读写实现js代码
Jun 11 #Javascript
犀利的js 函数集合
Jun 11 #Javascript
js 操作css实现代码
Jun 11 #Javascript
图片连续滚动代码[兼容IE/firefox]
Jun 11 #Javascript
Javascript Tab 导航插件 (23个)
Jun 11 #Javascript
You might like
古巴咖啡 Cubita琥爵咖啡 独特的加勒比海风味咖啡
2021/03/06 新手入门
用PHP和ACCESS写聊天室(三)
2006/10/09 PHP
php数据库抽象层 PDO
2011/05/07 PHP
CodeIgniter图像处理类的深入解析
2013/06/17 PHP
PHP static局部静态变量和全局静态变量总结
2014/03/02 PHP
在PHP 7下安装Swoole与Yar,Yaf的方法教程
2017/06/02 PHP
windows 2008r2+php5.6.28环境搭建详细过程
2019/06/18 PHP
prototype 1.5相关知识及他人笔记
2006/12/16 Javascript
JQuery打造PHP的AJAX表单提交实例
2009/11/03 Javascript
jquery formValidator插件ajax验证 内容不做任何修改再离开提示错误的bug解决方法
2013/01/04 Javascript
js文件缓存之版本管理详解
2013/07/05 Javascript
javascript获取隐藏dom的宽高 具体实现
2013/07/14 Javascript
js与jQuery 获取父窗、子窗的iframe
2013/12/20 Javascript
jquery遍历select元素(实例讲解)
2013/12/31 Javascript
js实现进度条的方法
2015/02/13 Javascript
简介JavaScript中的push()方法的使用
2015/06/09 Javascript
JavaScript兼容浏览器FF/IE技巧
2016/08/14 Javascript
jQuery 插件封装的方法
2016/11/16 Javascript
微信JSAPI Ticket接口签名详解
2020/06/28 Javascript
微信小程序通过js实现瀑布流布局详解
2019/08/28 Javascript
[04:39]显微镜下的DOTA2第十三期—Pis卡尔个人秀
2014/04/04 DOTA
python使用cookie库操保存cookie详解
2014/03/03 Python
ubuntu环境下python虚拟环境的安装过程
2018/01/07 Python
PyQT5 emit 和 connect的用法详解
2019/12/13 Python
python实现word文档批量转成自定义格式的excel文档的思路及实例代码
2020/02/21 Python
Python实现七个基本算法的实例代码
2020/10/08 Python
Python中免验证跳转到内容页的实例代码
2020/10/23 Python
英国领先的珍珠首饰品牌:Orchira
2016/09/11 全球购物
斯福泰克软件测试面试题
2015/02/16 面试题
质检部岗位职责
2013/11/11 职场文书
顶撞领导检讨书
2014/01/29 职场文书
政府领导干部个人对照检查材料思想汇报
2014/09/24 职场文书
2015年度学校卫生工作总结
2015/05/12 职场文书
男方家长婚礼答谢词
2015/09/29 职场文书
2016廉政教育学习心得体会
2016/01/25 职场文书
CSS3通过var()和calc()函数实现动画特效
2021/03/30 HTML / CSS