0-9 对应的keyCode是 48-57

在中文输入法模式下：

数字和字母的按键，以及tab键的keyCode为229

回车的回车的 keyCode 为8

以后在JS中少用按键的keyCode来判断数字的输入

直接用String.fromCharCode的方法来获得输入的字符，然后进行正则表达式的判读

找到一种可以屏蔽复制，拖曳的方法，并且只能输入数字，而且使用能让输入法的框消失

安装Sublime text 2插件很方便，可以直接下载安装包解压缩到Packages目录（菜单->preferences->packages）。

使用Package Control组件安装

也可以安装package control组件，然后直接在线安装：

1. 按Ctrl+`调出console（注：安装有QQ输入法的这个快捷键会有冲突的，输入法属性设置-输入法管理-取消热键切换至QQ拼音）
2. 粘贴以下代码到底部命令行并回车：

import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read()) 

1. 重启Sublime Text 3。
2. 如果在Perferences->package settings中看到package control这一项，则安装成功。

顺便贴下Sublime Text2 的代码

import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')  

如果这种方法不能安装成功，可以到这里下载文件手动安装。

用Package Control安装插件的方法：

1. 按下Ctrl+Shift+P调出命令面板
2. 输入install 调出 Install Package 选项并回车，然后在列表中选中要安装的插件。

不爽的是，有的网络环境可能会不允许访问陌生的网络环境从而设置一道防火墙，而Sublime Text 2貌似无法设置代理，可能就获取不到安装包列表了。
好，方法介绍完了，下面是本文正题，一些有用的Sublime Text 2插件：

GBK Encoding Support

对应gb2312来说，Sublime Text 2 本生不支持的，我们可以通过Ctrl+Shift+P调出命令面板或Perferences->Package Contro,输入install 调出 Install Package 选项并回车，在输入“GBK Encoding Support”选择开始安装，左下角状态栏有提示安装成功。这时打开gbk编码的文件就不会出现乱码了，如果有需要转成utf-8的可以在File-GBK to UTF8-选择Save with UTF8就偶看了。

Zen Coding

这个，不解释了，还不知道ZenCoding的同学强烈推荐去看一下：《Zen Coding: 一种快速编写HTML/CSS代码的方法》。

emmet

PS:Zen Coding for Sublime Text 2插件的开发者已经停止了在Github上共享了，现在只有通过Package Control来安装。

jQuery Package for sublime Text

如果你离不开jQuery的话，这个必备～～

Sublime Prefixr

Prefixr，CSS3 私有前缀自动补全插件，显然也很有用哇

Sublime Prefixr

JS Format

一个JS代码格式化插件。

SublimeLinter

一个支持lint语法的插件，可以高亮linter认为有错误的代码行，也支持高亮一些特别的注释，比如“TODO”，这样就可以被快速定位。（IntelliJ IDEA的TODO功能很赞，这个插件虽然比不上，但是也够用了吧）

SublimeLinter

Placeholders

故名思意，占位用，包括一些占位文字和HTML代码片段，实用。

Sublime Alignment

用于代码格式的自动对齐。传说最新版Sublime 已经集成。

Clipboard History

粘贴板历史记录，方便使用复制/剪切的内容。

DetectSyntax

这是一个代码检测插件。

Nettuts Fetch

如果你在用一些公用的或者开源的框架，比如 Normalize.css或者modernizr.js，但是，过了一段时间后，可能该开源库已经更新了，而你没有发现，这个时候可能已经不太适合你的项目了，那么你就要重新折腾一遍或者继续用陈旧的文件。Nettuts Fetch可以让你设置一些需要同步的文件列表，然后保存更新。

JsMinifier

该插件基于Google Closure compiler，自动压缩js文件。

Sublime CodeIntel

代码自动提示

Bracket Highlighter

类似于代码匹配，可以匹配括号，引号等符号内的范围。

Hex to HSL

自动转换颜色值，从16进制到HSL格式，快捷键 Ctrl+Shift+U

GBK to UTF8

将文件编码从GBK转黄成UTF8，快捷键Ctrl+Shift+C

Git

该插件基本上实现了git的所有功能。

总结

好吧，大概就这些，如果你有常用的插件或者扩展，欢迎推荐。Sublime Text 3真是一款一见钟情的编辑器，每次和别人聊到编辑器时必荐的。。。

 
AngularJS诞生以来，吸引了大量的目光，也迅速成为了Web开发领域的新宠。本文整理了2013年度一些非常有价值的AngularJS相关教程和资源，如果你想了解AngularJS或正在使用AngularJS，那么这些资源肯定会为你的学习和进阶过程带来帮助。 

一、了解AngularJS 

• AngularJS维基百科
• 专访AngularJS框架创始人Misko Hevery
• Angular.js VS. Ember.js：谁将成为Web开发的新宠？

二、中文资源 

1.  中文系列资源 

• AngularJS系列教程文章 – 大漠穷秋
• AngularJS入门系列教程 – AngularJS中文社区
• AngularJS学习笔记 – 邹业盛
• AngularJS精彩问答 - 知乎

2.  其他单篇文章 

• AngularJS 最佳实践
• 有jQuery背景的开发者如何建立起AngularJS的思维模式？
• 现在就开始使用AngularJS的三个重要原因
• 使用AngularJS构建大型Web应用
• Angularjs开发一些经验总结
• 5个示例带你学习AngularJS

3.  中文书籍 

• 《使用AngularJS开发下一代WEB应用》

三、英文资源 

1.  AngularJS入门教程 

• AngularJS傻瓜教程系列
• AngularJS移动开发权威指南
• AngularJS 30分钟入门
• 60分钟掌握AngularJS
• 在你的AngularJS应用中建模数据
• 使用$https创建服务
• 了解AngularJS的5个步骤
• AngularJS和RequireJS的动态加载控制器和视图
• 先进的设计模式和最佳实践
• AngularJS动画
• AngularJS Factory与RESTful服务的交互
• 使用Angular.js Factory获取远程数据
• 使用AngularJS的10个理由
• AngularJS中Providers之间的差异
• AngularJS过滤
• 针对jQuery开发者的AngularJ教程
• Web开发者应该了解AngularJS的10个理由
• Angular Js：何时应该使用Directive、Controller和Service？
• 30秒从jQuery转到AngularJS

2.  AngularJS指令学习 

• 为jQuery插件构建AngularJS指令
• 为D3.js条形图构建AngularJS指令
• www.directiv.es：AngularJS指令库
• Angular-localStorage
• Videogular：一个基于AngularJS的HTML5视频播放器
• Angular-cache
• 可用于Twitter Bootstrap的Angular指令
• Angular的图表指令和服务
• 表排序

3.  AngularJS应用开发实战 

• 通过示例学习AngularJS——客户管理应用程序
• AngularJS和IndexedDB结合使用
• AngularJS：构建一个可重用的点击编辑指令
• Play、Akka、AngularJS和Elasticsearch打造的实时日志搜索功能
• 使用Firebase和AngularJS打造自己的Google Reader
• 使用Phonegap、AngularJS和ExpressJS开发一个移动App
• BirdWatch v0.2：基于AngularJS、ElasticSearch和Play Framework的Tweet流分析工具
• 基于Solr和AngularJS的即时搜索工具
• Sortis：高级用户的Twitter客户端，初学者的跳板
• 可定制的Twitter AngularJS时间轴
• AngularJS指令设计更轻松

4.  AngularJS游戏开发 

• 基于CoffeeScript和AngularJS的画圈打叉游戏
• 超级马里奥卡片翻转游戏

5.  AngularJS工作流程和测试 

• AngularJS的测试策略 [视频]
• 使用Combining Yeoman、AngularJS和Cordova开发移动App
• 介绍Angular、Yeoman和Chrome应用程序 [视频]
• 使用Jasmine测试Angular.js应用
• 使用AngularJS和Karma进行全谱系测试
• 使用Grunt插件创建AngularJS文档
• ng-boilerplate：新的AngularJS项目的样板
• 基于AngularJS的Chrome Web检查器扩展
• 在Sublime Text中使用AngularJS包

6.  AngularJS书籍 

• 《AngularJS in Action》
• 《The Beginner’s guide to AngularJS》
• 《Mastering Web Application Development with AngularJS》 

构造函数使用this关键字给所有属性和方法赋值.因为构造函数只是一个函数,所以可使ClassA的构造方法称为ClassB的方法,然后调用它.

ClassB就会收到ClassA的构造方法中定义的属性和方法.

例子:

        function ClassA(name){             this.name=name;             this.getName=function(){                 return this.name;             }         }                  function ClassB(name,password){             this.ClassA=ClassA;             this.ClassA(name);             delete this.ClassA;                          this.password=password;             this.getPassword=function(){                 return this.password;             }         }                  var b =new ClassB('wwww','1123');         document.write(b.getName());

经过调试,我们可以看到:

变量b中已经包含了ClassA中定义的方法.

代码理解:

在ClassB中,this.ClassA(name)等价于以下代码:
            this.name=name;
            this.getName=function(){
                return this.name;
            }

即:将ClassA函数中的代码复制过来,即:ClassB中的代码如下:

        function ClassB(name,password){             this.ClassA=ClassA;                          this.name=name;             this.getName=function(){                 return this.name;             }                          delete this.ClassA;                          this.password=password;             this.getPassword=function(){                 return this.password;             }         }

然后通过delete this.ClassA之后,ClassB中的实际代码如下:

        function ClassB(name,password){             this.name=name;             this.getName=function(){                 return this.name;             }                          this.password=password;             this.getPassword=function(){                 return this.password;             }         }

从而实现了对象冒充.

注意:

对象冒充可以支持多重继承,也就是说一个类可以继承多个类.例子如下:

        function ClassC(){             this.ClassX=ClassX;             this.ClassX();             delete this.ClassX;                          this.ClassY=ClassY;             this.ClassY();             delete this.ClassY;         }

这样就ClassC就实现了继承自ClassX,ClassY.但此处存在一个弊端:

若ClassX和ClassY中存在两个同名的变量或方法,则ClassY会覆盖ClassX中的变量或方法.

此外:

我们还可以通过call()和apply()方法实现对象冒充.

对于call方法:

它的第一个参数用做this的对象,其他参数都直接传递给函数自身.我们来看下面这个小例子:

        function ShowColor(param1,param2){             this.getColor=function(){                 document.write(this.color+"<br/>Two Params : "+param1+" ; "+param2);             }         }                  var obj = new Object;         obj.color='Red';         ShowColor.call(obj,"pm1",'pm2');                  obj.getColor();

运行此段代码后,我们发现页面上显示为:

解释:

ShowColor方法是在对象外定义的,调用call时,它将第一个参数,也就是将ClassA的this指向了obj,将后面的参数"pm1"传递给了param1,'pm2'传递给了param2.

        var obj = new Object;         obj.color='Red';         ShowColor.call(obj,"pm1",'pm2');

也就实现了以下效果:

我们将上面代码中的obj.color='Red'给注释起来,再运行代码,结果如下:

原因是obj并没有color属性,而obj.getColor()方法中需要this.color,即obj.color,所以会出现undefined的结果.

我们再来看如何利用call来实现对象冒充,继续以刚才的ClassA,ClassB为例:

        function ClassA(name){             this.name=name;             this.getName=function(){                 return this.name;             }                     }                  function ClassB(name,password){             //this.ClassA=ClassA;             //this.ClassA(name);             //delete this.ClassA;             ClassA.call(this,name);                          this.password=password;             this.getPassword=function(){                 return this.password;             }         }         var b = new ClassB('www','111');         b.getPassword();

调试效果:

解释:

此处的ClassA.call(this,name); 即将ClassA的this指向了ClassB的this.从而实现了对象冒充.

现在,我们再来看apply方法.

apply方法有两个参数,用作this的对象和要传传递给函数的参数的数组.

例子:

        function ShowColor(param1,param2){             this.getColor=function(){                 document.write(this.color+"<br/>Two Params : "+param1+" ; "+param2);             }         }                  var obj = new Object;         obj.color='Red';         ShowColor.apply(obj,new Array("pm1",'pm2'));                  obj.getColor();

此方法可以被用于对象冒充:

        function ClassA(name){             this.name=name;             this.getName=function(){                 return this.name;             }                     }                  function ClassB(name,password){             //this.ClassA=ClassA;             //this.ClassA(name);             //delete this.ClassA;             ClassA.apply(this,new Array(name));                          this.password=password;             this.getPassword=function(){                 return this.password;             }         }                  var b = new ClassB('www','111');         b.getPassword();

调试效果:

原型继承

Javascript对象的创建和继承使用了一套特别的模式,称作原型式继承.

原理是:对象的构造函数可以从其他对象中继承方法,它创建出一个原型对象后,所有其他的新对象都可以基于这个原型对象来构建.

原型本身并不会从其他原型或者构造函数中继承属性,而属性都是从实际对象那里继承过来的.

例1:

        function Person(name){             this.name=name;         }                  Person.prototype.GetName=function(){             return this.name;         }                  function User(name,password){             this.name = name;             this.password = password;         }                  User.prototype = new Person();         User.prototype.GetPassword=function(){             return this.password;         }

解释:

User.prototype = new Person();这句话如何理解呢?User是对User对象构造函数的引用,new Person()使用person构造函数创建了一个Person对象,然后把Person对象的原型置为这个操作的结果.也就是说,当每次new User()时,得到的新User对象都会带有Person对象的所有方法.

对于最常用的关闭窗口链接，都比较熟悉，使用的Javascript函数就是：window.close()，写完后在IE下测试，完全搞定；当你用Mozilla内核的浏览器打开时，点击关闭窗口按钮，你会发现事件并不会像你想象的那么顺利，窗口根本就是无动于衷（真痛恨浏览器的兼容性吧，哈哈，淡定，没有浏览器的兼容性，又怎么会有前端开发这个职业呢），这并不是Mozilla内核浏览器不支持window.close()这个方法（打开W3CSCHOOL，你会发现在Firefox 1.0就已经支持了），那到底是什么原因引起Firefox没有执行这段代码呢（准确地说应该是执行了，但没有产生预期的效果而已，本人一直坚信：就目前这技术，机器是不会骗人的，一切还是人为原因）？

经过Google一翻，在一篇名为：在Firefox 2.0中无法用Javascript关闭父窗口（原名：Cannot close parent window using javascript in Firefox 2.0）中找到真正的原因，其中有个网友直接使用下面的代码的（问题是：Firefox 2.0以下执行，但2.0无效）:

function closeWindow() {
window.open('','_parent','');
window.close();
}

一位很了解这个问题的网友给出讲解并贴出了原因：它当然不会关闭，如果在window.open方法中不添加URL参数照样执行，但是下面的一行并不会执行或不会做任何事情。下面的稍微变化的代码指出的close()方法常见的错误―close()方法不能关闭非Javascript脚本打开的窗口（原文：Yes, that doesn’t do anything. If I change the missing URL in the window.open command to an actual page, it executes but then the next line doesn’t run or doesn’t do anything. The following variation gives the usual script error for the close() method in this scenario — can’t close a window not opened by a script）：

function closeWindow() {
newwin = window.open(location.href,'_parent','');
newwin.close();
}

如果你使用window.open打开一个窗口，这时你才可以使用window.close去关闭它，相反如果你通过常规链接打开的窗口，window.close根本就关闭不了它，需要额外的用户权限；这比直接使用关闭按钮更令人讨厌…（原文：If you launch the initial Firefox window using window.open, then window.close should work on it. However, if it is launched from a regular URL, then as you know it doesn’t work. There is a way to ask the user for extra permissions. However, that might be more annoying than leaving the window open…），原来上面的两段代码都只针对使用window.open打开的窗口，才能执行window.close关闭，而对于URL链接新开的窗口，必须要额外的用户权限（UniversalBrowserWrite privilege），其实只要在执行关闭窗口之前加上：

netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");

这段代码即可，具体说明参见Mozilla官网的“如何使用扩展权限”（Using Expanded Privileges）

   它们的作用都是将函数绑定到另外一个对象上去运行，两者仅在定义参数方式有所区别：

    apply(thisArg,argArray);

    call(thisArg[,arg1,arg2…] ]);

即所有函数内部的this指针都会被赋值为thisArg，这可实现将函数作为另外一个对象的方法运行的目的

apply的说明

       如果 argArray 不是一个有效的数组或者不是 arguments 对象，那么将导致一个 TypeError。 
如果没有提供 argArray 和 thisArg任何一个参数，那么 Global 对象将被用作 thisArg， 
并且无法被传递任何参数。

call的说明

      call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisArg指定的新对象。 
如果没有提供 thisArg参数，那么 Global 对象被用作 thisArg

相关技巧：

     应用call和apply还有一个技巧在里面，就是用call和apply应用另一个函数（类）以后，当前的 
函数（类）就具备了另一个函数（类）的方法或者是属性，这也可以称之为“继承”。看下面示例:

// 继承的演示 
 function base() { 

上面的例子可以看出，通过call之后，extend可以继承到base的方法和属性。

call 方法 

调用一个对象的一个方法，以另一个对象替换当前对象。 

call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 

参数 

thisObj 

可选项。将被用作当前对象的对象（替代当前对象的对象）。 

arg1, arg2, , argN 

可选项。将被传递方法参数序列（传递给替代对象的参数列表）。 

说明 

call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 

如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。 

说明白一点其实就是更改对象的内部指针，即改变对象的this指向的内容。这在面向对象的js编程过程中有时是很有用的。 

引用网上一个代码段，运行后自然就明白其道理。 

 <input type="text" id="myText" value="input text"> 

 function Obj(){this.value="对象！";} 

call函数和apply方法的第一个参数都是要传入给当前对象的对象，及函数内部的this。后面的参数都是传递给当前对象的参数。 

运行如下代码： 

 var func=new function(){this.a="func"} 

可见分别弹出了func和var。到这里就对call的每个参数的意义有所了解了。 

对于apply和call两者在作用上是相同的，但两者在参数上有区别的。 

对于第一个参数意义都一样，但对第二个参数： 

apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入，而call则作为call的参数传入（从第二个参数开始）。 

如 func.call(func1,var1,var2,var3)对应的apply写法为：func.apply(func1,[var1,var2,var3]) 

同时使用apply的好处是可以直接将当前函数的arguments对象作为apply的第二个参数传入

前言
Javascript是一门基于对象的动态语言，也就是说，所有东西都是对象，一个很典型的例子就是函数也被视为普通的对象。Javascript可以通过一定的设计模式来实现面向对象的编程，其中this “指针”就是实现面向对象的一个很重要的特性。但是this也是Javascript中一个非常容易理解错，进而用错的特性。特别是对于接触静态语言比较久了的同志来说更是如此。

示例说明
我们先来看一个最简单的示例：

 var name = "Kevin Yang";

      这段代码很简单，我们定义了一个全局字符串对象name和函数对象sayHi。运行会弹出一个打招呼的对话框，“你好，我的名字叫Kevin Yang”。

我们把这段代码稍微改一改：

     var name = "Kevin Yang";

      这段代码和上段代码的区别就在于sayHi函数在使用name的时候加上了this.前缀。运行结果和上面一摸一样。这说明this.name引用的也还是全局的name对象。

开头我们不是说了，函数也是普通的对象，可以将其当作一个普通变量使用。我们再把上面的代码改一改：

这一次，我们又创建了一个全局对象person，并将sayHi函数对象赋给person对象的sayHello属性。运行结果如下：

     这一次打招呼的内容就有点无厘头了，我们发现this.name已经变成undefined了。这说明，在sayHello函数内部执行时已经找不着this.name对象了(person对象没有定义一个name属性)。如果我们重新定义person对象，在其上面加上一个name属性又会怎么样呢？

var person = {name:"Marry"};运行代码发现打招呼的“人”变了：

是不是看出点道道了呢？

判别this指针的指导性原则
在Javascript里面，this指针代表的是执行当前代码的对象的所有者。

在上面的示例中我们可以看到，第一次，我们定义了一个全局函数对象sayHi并执行了这个函数，函数内部使用了this关键字，那么执行this这行代码的对象是sayHi（一切皆对象的体现），sayHi是被定义在全局作用域中。其实在Javascript中所谓的全局对象，无非是定义在window这个根对象下的一个属性而已。因此，sayHi的所有者是window对象。也就是说，在全局作用域下，你可以通过直接使用name去引用这个对象，你也可以通过window.name去引用同一个对象。因而this.name就可以翻译为window.name了。

      再来看第二个this的示例。我们定义了一个person的对象，并定义了它的sayHello属性，使其指向sayHi全局对象。那么这个时候，当我们运行person.sayHello的时候，this所在的代码所属对象就是sayHello了（其实准确来说，sayHi和sayHello是只不过类似两个指针，指向的对象实际上是同一个），而sayHello对象的所有者就是person了。第一次，person里面没有name属性，因此弹出的对话框就是this.name引用的就是undefined对象（Javascript中所有只声明而没有定义的变量全都指向undefined对象）；而第二次我们在定义person的时候加了name属性了，那么this.name指向的自然就是我们定义的字符串了。

理解了上面所说的之后，我们将上面最后一段示例改造成面向对象式的代码。

      var name = "Kevin Yang";

      在上面这段代码中，我们定义了一个Person的“类”（实际上还是一个对象），然后在这个类的原型（类原型相当于C++中的静态成员变量的概念）中定义了sayHello属性，使其指向全局的sayHi对象。运行代码我们可以看到，marry和kevin都成功的向我们打了声“招呼”。

      在这段代码中有两点需要思考的，一个是new我们很熟悉，但是在这里new到底做了什么操作呢？另外一个是，这里执行sayHello的时候，this指针为什么能够正确的指向marry和kevin对象呢？

我们来把上面定义“类”和实例化类对象的操作重新“翻译”一下：

      当然这段代码并不能正确执行，但是它可以帮助你更好的理解这个过程。

      当我们使用new关键字实例化一个“类”对象的时候，Javascript引擎会在这个对象内部定义一个新的对象并将其存入this指针。所有此对象内部用到this的代码实际上都是指向这个新的对象。如this.name = name，实际上是将参数中的name对象赋值给了这个新创建的对象。函数对象执行完之后Javascript引擎会将此对象返回给你，于是就有marry变量得到的对象的name为“Marry”，而kevin变量得到的对象的name属性确实“Kevin”。

容易误用的情况
理解了this指针后，我们再来看看一些很容易误用this指针的情况。

示例1——内联式绑定Dom元素的事件处理函数

   function sayHi(){

在此例代码中，我们绑定了button的点击事件，期望在弹出的对话框中打印出点击元素的标签名。但运行结果却是：

     也就是this指针并不是指向input元素。这是因为当使用内联式绑定Dom元素的事件处理函数时，实际上相当于执行了以下代码：

     在这种情况下sayHi函数对象的所有权并没有发生转移，还是属于window所有。用上面的指导原则一套我们就很好理解为什么this.tagName是undefined了。

那么如果我们要引用元素本身怎么办呢？

我们知道，onclick函数是属于btnTest元素的，那么在此函数内部，this指针正是指向此Dom对象，于是我们只需要把this作为参数传入sayHi即可。

   function sayHi(el){

等价代码如下：

 document.getElementById("btnTest").onclick = function(){

 示例2——临时变量导致的this指针丢失

       var Utility = {

        decode:function(str){
            return unescape(str);
        },
        getCookie:function(key){
            //  省略提取cookie字符串的代码
            var value = "i%27m%20a%20cookie";
            return this.decode(value);
        }
    };
    alert(Utility.getCookie("identity"))

     我们在写稍微有点规模的Js库的时候，一般都会自己封装一个Utility的类，然后将一些常用的函数作为Utility类的属性，如客户端经常会用到的getCookie函数和解码函数。如果每个函数都是彼此独立的，那么还好办，问题是，函数之间有时候会相互引用。例如上面的getCookie函数，会对从document.cookie中提取到的字符串进行decode之后再返回。如果我们通过Utility.getCookie去调用的话，那么没有问题，我们知道，getCookie内部的this指针指向的还是Utility对象，而Utility对象时包含decode属性的。代码可以成功执行。

但是有个人不小心这样使用Utility对象呢？

   function showUserIdentity(){

      这个时候运行代码会抛出异常“this.decode is not a function”。运用上面我们讲到的指导原则，很好理解，因为此时Utility.getCookie对象被赋给了临时变量getCookie，而临时变量是属于window对象的——只不过外界不能直接引用，只对Javascript引擎可见——于是在getCookie函数内部的this指针指向的就是window对象了，而window对象没有定义一个decode的函数对象，因此就会抛出这样的异常来。

这个问题是由于引入了临时变量导致的this指针的转移。

 
     前面两种都比较好理解，第三种需要提一下。正是因为this指针的指向很容易被转移丢失，因此Javascript提供了两个类似的函数apply和call来允许函数在调用时重新显式的指定this指针。

修正代码如下：

  function showUserIdentity(){

call和apply只有语法上的差异，没有功能上的差别。

示例3——函数传参时导致的this指针丢失

我们先来看一段问题代码：

     var person = {

这段代码期望在访客进入页面5秒钟之后向访客打声招呼。setTimeout函数接收一个函数作为参数，并在指定的触发时刻执行这个函数。可是，当我们等了5秒钟之后，弹出的对话框显示的this.name却是undefined。

      其实这个问题和上一个示例中的问题是类似的，都是因为临时变量而导致的问题。当我们执行函数的时候，如果函数带有参数，那么这个时候Javascript引擎会创建一个临时变量，并将传入的参数复制（注意，Javascript里面都是值传递的，没有引用传递的概念）给此临时变量。也就是说，整个过程就跟上面我们定义了一个getCookie的临时变量，再将Utility.getCookie赋值给这个临时变量一样。只不过在这个示例中，容易忽视临时变量导致的bug。

函数对象传参
对于函数作为参数传递导致的this指针丢失的问题，目前很多框架都已经有方法解决了。

Prototype的解决方案——传参之前使用bind方法将函数封装起来，并返回封装后的对象

   var person = {

bind方法的实现其实是用到了Javascript又一个高级特性——闭包。我们来看一下源代码：

     首先将this指针存入函数内部临时变量，然后在返回的函数对象中引用此临时变量从而形成闭包。

微软的Ajax库提供的方案——构建委托对象

     var person = {

其实本质上和prototype的方式是一样的。

著名的Extjs库的解决方案采用的手法和微软是一样的。 

很早之前就听说有jslint这个东东，但是一直没有用过。说得简单点，这是一个js代码校验的工具。

官方网站：http://www.jslint.com/lint.html

在线校验地址：http://www.jslint.com/

用在线校验的校验有些不太方便，因为每次都要粘贴复制代码。如果能把jslint结合到EditPlus里面应该灰常方便。

找到如下解决方案

从http://www.jslint.com/fulljslint.js下载这个js文件，放到editplus的安装目录中，我的是C:"Program Files"EditPlus 3

菜单文本：javascript调试
调试命令：cmd /c
参数：cscript “$(FileName)” cscript “jslint的路径” < "$(FileName)"(被删除的部分是网上大部分的说法，但是我实际操作了一下，发现这段命令只会检测jslint这个文件，于是我尝试删除了<前面的东东，发现就能校验当前文件了)
初始目录：$(FileDir)
钩选：捕捉输出
在输出模式使用正则表达式：^Lint at line ([0-9]+) character ([0-9]+).*$”
上面这行好像就是默认的，不用改。

EditPlus里面配置jslint

存在问题：目前校验下来，一般的js代码如果有问题，会正常报错。但是对于我们的框架而言，只要检测到$符号，就会报错。
我想这个应该在jslint.js文件中处理一下对应的逻辑。

使用时调用这个函数即可。如：

<a href="javascript:void(0);" onclick="javascript:openwindow('a.html','',400,200);">转到a</a>

缺点：与原窗口的大小，位置无关。

    cookie虽然是由一个网页所创建，但并不只是创建cookie的网页才能读 取该cookie。在默认情况下，与创建cookie的网页在同一目录或子目录下的所有网页都可以读取该cookie。但如果在这个目录下还有子目录，要 使在子目录中也可以访问，则需要使用path参数设置cookie，语法如下：
document.cookie="name=value; path=cookieDir";
   如果要使cookie在整个网站下可用，可以将cookieDir指定为根目录，示例如下：
document.cookie="userId=320; path=/";
   上面所说都指的是在同一个目录中的访问，可是要想在不同虚拟目录中访问则要另外想办法来解决这个问题。但是path不能解决在不同域中访问cookie的 问题。在默认情况下，只有和设置cookie的网页在同一个Web服务器的网页才能访问该网页创建的cookie。但可以通过domain参数来实现对其 的控制，其语法格式如下：
document.cookie="name=value; domain=cookieDomain";

具体代码如下，直接运行即可：

设置路径：

<html>
<head>
    <title>设置cookie的路径</title>
<script language="javascript" type="text/javascript">
   <!--

    var now=new Date();
   now.setDate(now.getDate()+1);
   var cookies="userName="+escape("哈哈")+";expires="+now.toString()+";path=/";
   document.cookie=cookies;
   document.write("cookie文件中的内容为：<br>",unescape(document.cookie));
   -->
</script>

</head>
<body></body>

</html>

设置域：

<html>
<head>
    <title>设置cookie的路径</title>
<script language="javascript" type="text/javascript">
   <!--

   

   var now=new Date();
   now.setDate(now.getDate()+1);
   var cookies="userName="+escape("哈哈")+";expires="+now.toString()+";path=/; domain=.baidu.com";
   document.cookie=cookies;
   document.write("cookie文件中的内容为：<br>",unescape(document.cookie));
   -->
</script>

</head>
<body></body>

</html>

微软曾出品了一款叫Microsoft Ajax Minifier的Js压缩工具，适用于所有的Js文件，左手烟@今天特地又拿出来研究一下，我是个完美主义者，对什么都讲求精益求精，所以下面的解说朋友们都应该能够理解与明白，我们只要会用即可，不必深究其技术层面的东西。

优点：压缩率高、安全可靠、代码规范

缺点：需要手动输入命令执行操作

第一步，下载最新版的 Microsoft Ajax Minifier 1.1，点击 I Agree 按钮后下载文件并保存到桌面上，双击进行安装，之后在开始-程序-Microsoft Ajax Minifier文件夹中找到Microsoft Ajax Minifier Command Prompt，单击后弹出熟悉的CMD命令窗口，如图

第二步，将你需要压缩的Js文件复制到C盘以外的D或E等根目录，为什么要这么做？因为有使用Win 7的朋友对C盘的操作权限有限制，会导致文件不被生成，我们就放到D盘跟目录即可。下面先说说它的三种命令压缩方式：(举例：现在D盘有一个demo.js文件需要压缩)

1. 普通压缩：ajaxmin d:\demo.js 效果不大，不推荐使用，了解即可；
2. 高级压缩：ajaxmin d:\demo.js -o d:\demo1.js 将demo.js压缩后转换成demo1.js保存在D盘根目录，效果明显，推荐；
3. 超级压缩：ajaxmin -h d:\demo.js -o d:\demo2.js 将demo.js超级压缩后转换成demo2.js保存在D盘根目录，效果显著，强烈推荐；

敲回车键执行命令，出现crunching file ‘demo.js’…done.字样说明成功，同时，D盘根目录会多出来demo1.js或demo2.js文件。

有朋友会发现后两种方式压缩后的文件大小区别不大，也就2k左右。这里要说明一下这是为什么。当使用了-h（hyper-crunching）的指令，你会发现一些区域指令被改名成比较简单的命名，例如：var exists–>var a，因此字节数会再少一些，但是效果不打折，我们不必管它的原理，好用即可。

第三步，将压缩后的Js文件重命名后覆盖掉之前的，传至服务器。当然备份工作也是要做的，在测试没有问题时即可删掉原先臃肿的文件。

我们用最新的jQuery 1.3.2来做个试验。官方下载地址在这里。官方提供了2个版本，一个迷你版，大小为57253字节；完整版，大小为120763字节。用 -h 参数后迷你版大小为55860字节；完整版大小为55863字节，一大半被压缩掉了，效果非常显著。

引申阅读：玩WordPress的朋友都想尽办法让加载再快点，容量再小点，其它的Js压缩方法网上也很多，比如在线压缩。去这里试试效果吧。你会发现效率远没有Microsoft Ajax Minifier来得好，上面那个完整版在线进行超级压缩后为73285字节，这就是差距啊。微软毕竟是有一定技术含量的，不然也不会遛出来献丑了。:-)

function aa(){

    alert("first function");

};

aa();

有人会问能否再简化呢？答案是肯定的！只要你愿意我们还可以通过括号直 接调用函数

(function aa(){

    alert("(function)();");

})();

当然，也又别的方法，试试在函数前写上+或 者-吧！

+function aa(){

    alert("+function();");

}();

这是，我们浏览器中的代码应该是这样的：

<html>

    <head>

        <title>JavaScript 高级编程 之 同名函数的执行顺序</title>

        <script language="javascript" type="text/javascript">

            function aa(){

                alert("first function");

            };

            aa();

            (function aa(){

                alert("(function)();");

            })();

            +function aa(){

                alert("+function();");

            }();

        </script>

    </head>

    <body>

    </body>

</html>

现在让我们来想一想浏览器会出现怎样的结果?

坐在后排的那哥们儿举手了。听听他怎么说，他说:

“浏览器会按照1.first function 2.(function)(); 3.+function(); 方式执行”

我肯定一定会有很多人这样回答。好的，你可以坐下了。还是让我们去看看 执行的结果吧！

浏览器结果: 1.+function(); 2.(function)(); 3.+function(); 真是不可思议，为什么呢?

难道浏览器会认为在函数前面写+或者-会 让函数的执行级别更高？事实并非如此！下面我们再写一个函数，便可以证明这个结论是错误的。

function aa(){

    alert("last function");

};

或许，我们还会有带参的函数需要执行。

function aa(msg){

    alert(msg);

}

aa("hello topcss!");

好了，我们再去看看浏览器是否执行最后一个函数，也就是带参的函数呢。

的确，事实正是如此，她执行了最后一个函数。太棒了。

现在，我们得出了一个结论：

当我们在一个JavaScript程 序中，同时出现多个同名函数时，浏览器会去执行最后一个函数。