JavaScript-设计模式-面向对象编程

函数定义

全局定义

//函数定义
function checkName(){
    ...
}
//另外一种形式
var checkName = function(){...}
复制代码

这两种方式都会在全局做用域中建立一个全局变量,当定义的过多,多人协做,很容易覆盖掉.

用对象的方式定义

//对象方式定义
var CheckObj = {
    checkName : function (){...}
}
//另外一种方式
var CheckObj = function() {};
CheckObj.checkName = function(){...}
复制代码

当要使用checkName()方法时,直接CheckObj.checkName(),就能够

以返回对象的方式

var CheckObj = function () {
    return {
         checkName : function (){...}
    }
}

var a = CheckObj()
a.checkName()
复制代码

这样每次执行方法的时候都返回一个新对象

以类的方式

var CheckObj = function () {
    this.checkName : function (){...}
}
var a = new CheckObj();
a.checkName();
复制代码

这种方式建立就是类了,因此调用方法须要new CheckObj(),得到实例,咱们把全部的方法都放在了函数内部,经过this定义,因此每一次new 对象时,新建立的对象都会对类的this上的属性进行复制,因此新对象都会有一套属于本身的方法,可是这样消耗很大

以原型的方式

var CheckObj = function () {}
CheckObj.prototype.checkName = function () {...}
//另外一种形式
var CheckObj = function () {}
CheckObj.prototype = {
    checkName = function () {...}
}
复制代码

这样无论建立多少个实例,实例所拥有的方法都是一个,由于他们都从原型上往上找,都找到同一个方法

链式调用

var CheckObj = {
    checkName : function (){
        ...
        return this
    }
    checkEmail : function (){
        ...
        return this
    }
    checkAddr : function (){
        ...
        return this
    }
}
//调用方式
CheckObj.checkName().checkEmail().checkAddr()

//也能够放在原型上
var CheckObj = function () {}
CheckObj.prototype = {
    checkName : function (){
        ...
        return this
    }
    checkEmail : function (){
        ...
        return this
    }
    checkAddr : function (){
        ...
        return this
    }
}
//调用
var a = new CheckObj()
a.checkName().checkEmail().checkAddr()
复制代码

绑定到Function上

Function.prototype.checkName = function () {}
//调用
var f = function() {}
f.checkName()
//或者
var f  = new Function();
f.checkName();;
复制代码

不推荐这么使用:由于这样会污染了原生对象Function,当别人建立函数的时候也会被污染,形成没必要要的开销,因此能够提供一个公共的接口

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

//调用
var method = function(){};
//或者
var method = new Function();
method.addMethod('checkName',function(){
    ...
})
method.checkName();
复制代码

一样也能够链式调用

Function.prototype.addMethod = function(name,fn){
    this[name] = fn
    return this
}
//这样就能够链式添加原型上的方法
var method = new Function();
method.addMethod('checkName',function(){
    ...
}).addMethod('checkEmail',function(){
    ...
})
//若是想调用时也是用链式调用
method.addMethod('checkName',function(){
    ...
    return this
}).addMethod('checkEmail',function(){
    ...
    return this
})
method.checkName().checkEmail()
复制代码

类的调用方式

Function.prototype.addMethod = function(name,fn){
    this.prototype[name] = fn
    return this
}
//使用时
var Methods = function(){}
Methods.addMethod('checkName',function(){
    ...
})
var m = new Methods();
m.checkName()
复制代码

---

未完待续...

---

主要总结于<<JavaScript设计模式>>一书,有兴趣的能够看看