2019-07-03

作者: 綪比纸薄 | 来源:发表于2019-07-03 00:44 被阅读0次

    函数

    需求

    验证邮箱,姓名,密码

    直接声明函数

    function checkName(){} === var checkName = function(){}
    function checkEmail(){} === var checkEmail = funcion(){}
    function checkPassword(){} === var checkPassword = function(){}
    

    缺点: 声明过多全局变量, 如果多人开发 可能会造成变量名重复导致覆盖 方法失效

    用对象收编变量

    var CheckObjeck = {
        checkName: function(){}
        checkEmail: function(){}
        checkPassword: function(){}
    }
    // 调用
    CheckObjeck.checkName()
    

    另外一种创建方式 通过. 语法

    // 声明一个函数对象
    var CheckObjeck = funcion(){}
    CheckObjeck.checkName = function(){}
    CheckObjeck.checkEmail = function(){}
    CheckObjeck.checkPassword = function(){}
    

    这样定义对象方法时不能复制,或者说这个对象用new关键字创建新的对象时, 新创建的对象是不能继承这些方法的

    真假对象

    如果想简单的复制一下, 可以将这些方法放在一个函数对象中.

    var CheckObject = function(){
        return {
            checkName: function(){}
            checkEmail: function(){}
            checkPassword: function(){}
        }
    }
    // 可以使用new 方法新建一个并且调用
    var a = new CheckObject()
    a.checkName()
    

    这种方法 当每次调用这个函数的时候把之前写的那个对象返回出来, 当别人每次调用时都返回了一个新对象,这样执行明面上是CheckObject对象, 可实际上是返回的新对象

    虽然以上通过新建对象完成了需求,但是它不是一个真正意义上类的创建方式, 并且a对象和CheckObject没有任何关系
    类对象:

    var CheckObject = function(){
        this.checkName = function(){}
        this.checkEmail = function(){}
        ...
    }
    # 调用
    var a = new CheckObject()
    a.checkName()
    

    上面就可以看为一个类了

    检测类

    上面我我们把所有方法都放在函数内部, 通过this定义的, 所以每一次通过new创建新对象是, 新创建的对象都会对类的this上的属性进行复制. 所以这些新创建的对象都会有自己的一套方法, 然而有时候这么做造成的消耗是奢侈的
    处理:

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

    这样创建对象实例的时候,创建出来的对象所拥有的方法都是一个了, 因为他们都需要依赖prototype原型依次查找, 而找到的方法都是同一个, 它们都绑定在CheckObject对象的原型上
    另一种写法:

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

    但是这两种方法不能混用, 会造成覆盖
    当我门每次调用此方法时都需要写声明的对象

    var a = new CheckObject()
    a.checkName()
    a.checkEmail()
    

    链式调用

    在你声明的每一个方法末尾将当前对象返回

    var CheckObject = function(){}
    CheckObject.prototype = {
        checkName: function (){
            // 姓名验证
            ...
            return this
        },
        checkEmail: function(){
            // 邮箱验证
            ...
            return this
        }
        
    }
    // 调用
    var a = CheckObject()
    a.checkName().checkEmail()
    

    函数的祖先

    当我们想给每一个函数都添加一个检测邮箱方法时:

    Funtion.prototype.checkEmail = funtion(){}
    var f = funtion(){}
    f.checkEmail()
    // or
    var f = new Funtion()
    f.checkEmail();
    

    这样做会污染原生对象Function, 造成不必要的开销
    但是可以抽象出一个统一添加方法的功能方法

    Function.prototype.addMethod = funtion(name, fn){
        this[name] = fn
    }
    var methods = funtion(){};
    // or
    var methods = new Funtion()
    methods.addMethod('checkName', function(){})
    methods.addMethod('checkEmail', function(){})
    ...
    // 调用 
    methods.checkName()
    

    链式添加

    Function.prototype.addMethod = funtion(name, fn){
        this[name] = fn
        return this;
    }
    var methods = function(){};
    methods.addMethod('checkName', function(){}).addMethod('checkEmail', function(){})
    

    类形式

    Function.prototype.addMethod = funtion(name, fn){
        this.prototype[name] = fn
        return this;
    }
    
    var methods = function(){};
    methods.addMethod('checkName', function(){}).addMethod('checkEmail', function(){})
    // 需要通过new 关键字调用
    var m = new methods()
    m.checkEmail()
    
    

    相关文章

      网友评论

        本文标题:2019-07-03

        本文链接:https://www.haomeiwen.com/subject/ndtfhctx.html