1.第一篇:面向对象编程

2018-11-15  本文已影响0人  爱吃鱼的肥兔子

本文摘自 《JavaScript 设计模式》张容铭 著 版权归原作者所有

第1章 灵活的语言---JavaScript

1.1入职第一天

    function checkName(){
    // 验证姓名
    }
    function checkEmail(){
    // 验证邮箱
    }
    function checkPassword(){
    // 验证密码
    }

1.2函数的另一种形式

    var checkName = function(){
    // 验证姓名
    }
    var checkEmail = function(){
    // 验证邮箱
    }
    var checkPassword = function(){
    // 验证密码
    }

1.3用对象收编变量

    var checkObject = {
        checkName : function(){
        // 验证姓名
        }
        checkEmail : function(){
        // 验证邮箱
        }
        checkPassword : function(){
        // 验证密码
        }
    }

1.4对象的另一种形式

    var checkObject = function(){};
    checkObject.checkName = function(){
    // 验证姓名
    }
    checkObject.checkEmail = function(){
    // 验证邮箱
    }
    checkObject.checkPassword = function(){
    // 验证密码
    }

1.5真假对象

    var checkObject = function(){
        return {
            checkName:function(){
            // 验证姓名
            },
            checkEmail:function(){
            // 验证邮箱
            },
            checkPassword:function(){
            // 验证密码
            }
    
    }

这样执行过程中明面上是checkObject对象,实际是返回的新对象。
    var a = checkObject();
    a.checkName();

1.6类也可以

    var checkObject = function(){
        this.checkName = function(){
        //验证姓名
        },
        this.checkEmail = function(){
        // 验证邮箱
        },
        this.checkPassword = function(){
        // 验证密码
        }
    }

既然是个类,就要用new关键字来创建
var a = new checkObject();
a.checkName();

1.7一个检测类

var checkObject = function(){};
checkObject.prototype = {
    checkName:function(){
    // 验证姓名
    },
    checkEmail:function(){
    // 验证邮箱
    },
    checkPassword:function(){
    // 验证密码
    }
}
var a = new checkObject();
a.checkName();

1.8方法还可以这样用

var checkObject = {
    checkName:function(){
    // 验证姓名
    return this;
    },
    checkEmail:function(){
    // 验证邮箱
    return this;
    },
    checkPassword:function(){
    // 验证密码
    return this;
    }
};
  console.log(checkObject.checkName().checkEmail().checkPassword()) // {checkName: ƒ, checkEmail: ƒ, checkPassword: ƒ}
 
  console.log(checkObject.checkName().checkPassword) 
    //ƒ () {
      // 验证密码
      return this;
    }

也可以:

var checkObject = function(){};
checkObject.prototype = {
    checkName:function(){
    // 验证姓名
    return this;
    },
    checkEmail:function(){
    // 验证邮箱
    return this;
    },
    checkPassword:function(){
    // 验证密码
    return this;
    }
}
var a = new checkObject();
a.checkName();
a..checkName().checkPassword;

1.9函数的祖先

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 methods = function(){};
或者
var methods = new Function();
methods.addMethod('checkName',function(){
    //验证姓名
})
methods.checkName();

1.10链式添加

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


var methods = function(){};
methods.addMethod('checkName',function(){
    //验证名称
}).addMethod('checkEmail',function(){
    // 验证邮箱
}) 
或者
var methods = function(){};
methods.addMethod('checkName',function(){
    return this;
}).addMethod('checkEmail',function(){
    return this;
})

methods.checkName().checkEmail();

换一种方式使用方法

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

var Methods = function(){};
Methods.addMethod('checkName',function(){
    //验证名称
}).addMethod('checkEmail',function(){
    //验证邮箱
})

//实例这个对象 调用方法
var a = new Methods();
a.checkEmail();

上一篇 下一篇

猜你喜欢

热点阅读