javascript设计模式概述

掐指一算，再过几天我做前端就满三年了。日子真的不耐过，时间过去
了，但是自我感觉技术还是很low，页面可以画、业务可以做、组件可以封
装等等，但是我感觉我思想上还处于一个很初级的水平，很想挣脱这种困
境。最近重新学习一遍张容铭的javascript设计模式，希望对自己能有所提
升。为了让我的学习留下一点痕迹，更重要的是担心看了就忘，所以，就记
录一下学习的过程以及在学的过程中自己的一些领悟。
开始吧，希望自己能坚持下来！

一、函数直接声明

function checkName(){
    //验证姓名
}
function checkEmail(){
    //验证邮箱
}
function checkPassword(){
    //验证密码
}
使用直接声明方式定义函数，容易造成全局变量的污染，如果是团队合作
容易造成代码的覆盖。不建议使用。

二、函数表达式声明

var checkName =  function (){
    //验证姓名
}
var checkEmail = function (){
    //验证邮箱
}
var checkPassword = function (){
    //验证密码
}
函数表达式方式定义变量跟函数直接声明差不多，也声明了3个全局 变
量，造成了全局的污染，容易覆盖代码，不建议使用。

三、对象收编变量（1）

var  checkObject = {
    checkName: function (){
        //验证姓名
    },
    checkEmail : function (){
        //验证邮箱
    },
    checkPassword : function (){
        //验证密码
    }
    
}
checkObject.checkName()
使用一个对象承载所有的方法和属性，使用方法时，通过点语法实现调用

四、对象收编变量（2）

var checkObject = function(){}
checkObject.checkName = function(){}
checkObject.checkEmail = function(){}
checkObject.checkPassword = function(){}

var aa = checkObject ()
aa.checkName()

如果其他人也许使用checkName这样的方法，但是调用checkObject函
数，对应的方法是不能继承下来。所以我们学习下一种方法。

五、对象的返回实现方法的“继承”

var checkObject = function(){
    return{
        checkName:function(){

        },
        checkEmail:function(){

        },
        checkPassword:function(){

        }
    }
}
var aa = checkObject()
aa.checkName()

这里所说的继承不是真正意义上的继承，只是简单的通过调用函数返回所有的方法。

六、构造函数的方式实现方法的“继承”

var checkObject = function(){
   this.checkName = function(){

   }
   this.checkEmail = function(){

   }
   this.checkPassword = function(){
       
   }
   
}
var aa = new checkObject()
aa.checkName()
所有的方法都绑定到this上，每次通过new的方式创建一个实例，都会重新
创建一个新的对象，新的对象都会对this上的属性、方法实现复制，然而
这样做是很消耗的，我们可以做进一步优化

七、使用prototype实现继承

var CheckObject = function(){}
CheckObject.prototype.checkName = function(){}
CheckObject.prototype.checkEmail = function(){}
CheckObject.prototype.checkPassword = function(){}

 var aa = new CheckObject()
 aa.checkName()

把方法注册到构造函数的prototype原型上，就不会每次new 出来的实例把
构造函数的方法复制到新的实例对象上，实例的方法都是指向同一个，
即为构造函数的原型

还可以用以上的形式来写：
var CheckObject = function(){}
 CheckObject.prototype = {
     checkName:function(){},
     checkName:function(){},
     checkPassword:function(){}

 }
 var aa = new CheckObject()
 aa.checkName()

这里要注意一点，2种方法不能混着写，后一种方法相当是重写了构造函
数的prototype属性，也会把他之前默认的方法，属性覆盖。

八、实现链式编程

var CheckObject = function(){}
 CheckObject.prototype = {
     checkName:function(){
         return this
     },
     checkName:function(){
        return this
     },
     checkPassword:function(){
        return this
     }

 }
 var aa = new CheckObject()
 aa.checkName().checkEmail().checkPassword()
在方法的最后返回当前调用的实例this，就可以实现链式编程啦！

九、动态添加属性或方法

Function.prototype.addMethod = function(name,fn){
    this[name] = fn
      或者
    this.prototype.[name] = fn
 
}

 var methods = function(){}
//  或者
 var methods = new Function()
 methods.addMethod('checkName',function(){

 })
 methods.checkName()

给Function的prototype抽象出一个统一的方法，用来给实例添加方法或者
属性，这样一来，就可以很方便添加定制化的方法啦。


这个方法我觉得特别有用，比如某天我封装了一个牛逼轰轰的插件，适应
大多数的情况。突然有一天，某种情况下需要有一个特别的处理，但是此
时如果要对这种特别的情况进行处理，还要对原来的代码进行各种骚操作
的适配，这种做法是很难受的。如果我给这个类暴露一个用于添加方法或
属性的方法，我们就可以add一个方法，用于处理这种特殊的情况。