单一职责原则
就一个类而言，应该仅有一个引起它变化的原因。在JavaScript中，需要用到类的场景并不太多，单一职责原则（SRP）更多的是被运用在对象或者方法级别上。
总之，SRP原则体现为：一个对象（方法）只做一件事情。
例如：
代理模式
迭代器模式
单例模式
装饰者模式
但是，并不是所有的职责都应该一一分离的，一方面如果随着需求的变化，有两个职责是同时变化的，那就不必分离他们。比如在ajax请求的时候，创建xhr对象和发送xhr请求几乎总是在一起的，那么创建xhr对象的职责和发送xhr对象的职责就没有必要分开。
另一方面，职责的变化轴线仅当它们确定会发生变化时才有意义，即使两个职责已经被耦合在一起但他们
继续阅读 »
适配器模式的作用是解决两个软件实体间的接口不兼容问题。使用适配器模式之后，原本由于接口不兼容而不能工作的两个软件实体可以一起工作。
适配器模式的应用
适配模式是一种“亡羊补牢”的模式，没有人会在程序的设计之初就使用它，因为没有人可以完全预料到未来的事情，也许现在好好工作的接口未来就不再适用于新系统，那么我们可以使用适配器模式把旧的接口包装成新的接口，使他继续保持生命力。
比如在json数据流行之前，很多cgi返回的都是XML格式的数据，如果今天仍然想用这些接口，显然我们可以创造一个XML-JSON适配器。
比如有一段代码，我们向googleMap和baiduMap都发出显示请求时，他们分别以各自的方式在页面中展现了地图：
继续阅读 »
状态模式的关键是区分事物内部的状态，事物内部状态的改变往往会带来事物的行为改变。
电灯程序
首先给一个不用状态模式的电灯程序例子：
var Light = function() {
this.state = 'off'; //电灯初始状态off
this.button = null; //电灯开关按钮
};
Light.prototype.init = function() {
var button = document.createElement('button'),
self = this;
button.innerHTML = '开关';
this.button = document.
继续阅读 »
this的指向大概可以分成四种：
* 作为对象的方法调用
* 作为普通函数调用
* 构造器调用
* Function.prototype.call或Function.prototype.apply调用
1. 作为对象的时候，this指向该对象
var obj = {
a: 1,
getA: function() {
alert(this === obj); //true;
alert(this.a); //1
}
};
obj.getA();
2. 作为普通函数调用，this总是指向全局对象（在浏览器中就是window）
window.name = 'global
继续阅读 »
全屏API可以控制浏览器的全屏显示，让一个Element节点（以及子节点）占满用户的整个屏幕。目前各大浏览器的最新版本都支持这个API（包括IE11），但是使用的时候需要加上浏览器前缀。
more
方法
requestFullscreen()
Element节点的requestFullscreen方法，可以使得这个节点全屏。
```javascript
function launchFullscreen(element) {
if(element.requestFullscreen) {
element.requestFullscreen();
} else if(element.mozRequestFull
继续阅读 »
初识D3
D3是指数据驱动文档（Data-Driven Documents），根据D3的官方定义：
D3.js是一个JavaScript库，它可以通过数据来操作文档。D3可以通过使用HTML、SVG和CSS把数据鲜活形象地展现出来。D3严格遵循Web标准，因而可以让你的程序轻松兼容现代主流浏览器并避免对特定框架的依赖。同时，它提供了强大的可视化组件，可以让使用者以数据驱动的方式去操作DOM。----D3维基（2013年8月）
从一个Hello Wordld示例来看看d3如何运行 点击查看在线DEMO
```javascript
function render(data){
var demo = d3.select('b
继续阅读 »
事件
在d3入门系列文章中我们介绍过d3选择器，其中有提到选择器为交互添加或移除事件监听器的方法selection.on，除了选择器事件外，D3还提供了很多种事件机制，本节我们详细介绍下d3的事件机制
选择器事件
添加事件监听
跟jQuery类似的方法监听事件，传递参数为当前数据d和索引i;
如果所选择的元素相同类型的一个事件监听已经注册了，新的监听替换老的；
selection.on('click',function(d,i){
….
});
为相同事件类型注册多个监听器，该类型可以跟一个可选的命名空间，如“click.foo”和“click.bar”。
selection.on('click.foo',fu
继续阅读 »
你可能知道，Javascript语言的执行环境是"单线程"（single thread）。
所谓"单线程"，就是指一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。
more
这种模式的好处是实现起来比较简单，执行环境相对单纯；坏处是只要有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序的执行。常见的浏览器无响应（假死），往往就是因为某一段Javascript代码长时间运行（比如死循环），导致整个页面卡在这个地方，其他任务无法执行。
为了解决这个问题，Javascript语言将任务的执行模式分成两种：同步（Synchronous）和异步（Asynchronous）。
继续阅读 »
Javascript语言的设计不够严谨，很多地方一不小心就会出错。
举例来说，请考虑以下情况。
现在，我们要判断一个全局对象myObj是否存在，如果不存在，就对它进行声明。用自然语言描述的算法如下：
javascript
if (myObj不存在){
声明myObj;
}
你可能会觉得，写出这段代码很容易。但是实际上，它涉及的语法问题，远比我们想象的复杂。Juriy Zaytsev指出，判断一个Javascript对象是否存在，有超过50种写法。只有对Javascript语言的实现细节非常清楚，才可能分得清它们的区别。
more
第一种写法
根据直觉，你可能觉得可以这样写：
javascript
if (!myObj)
继续阅读 »
jQuery的开发速度很快，几乎每半年一个大版本，每两个月一个小版本。
每个版本都会引入一些新功能。今天我想介绍的，就是从jQuery 1.5.0版本开始引入的一个新功能----deferred对象。
这个功能很重要，未来将成为jQuery的核心方法，它彻底改变了如何在jQuery中使用ajax。为了实现它，jQuery的全部ajax代码都被改写了。但是，
它比较抽象，初学者很难掌握，网上的教程也不多。所以，我把自己的学习笔记整理出来了，希望对大家有用。
more
什么是deferred对象？
开发网站的过程中，我们经常遇到某些耗时很长的javascript操作。其中，既有异步的操作（比如ajax读取服务器数据），也有同
继续阅读 »