美文网首页
类jQuery封装

类jQuery封装

作者: JSUED | 来源:发表于2017-08-24 22:38 被阅读49次

    这种方式是我从 jQuery 那里学来的。

    jQuery 对象具有很强的集成性,可以作为函数调用,也可以做为对象调用,当作为函数调用的时候,她可以无需 new 而返回它的一个实例,很方便。

    var Person = function(info){
        return new Person.prototype.init(info);
    }
     
    Person.prototype = {
        constructor: Person,
        init:function(){
            this.name = info.name.
        }
    }
    Person.prototype.init.prototype = Person.prototype;
    

    这种封装方式非常巧妙。
    将对象的构造操作放在函数的里面,而自己充当一个工厂。
    不断调用 prototype 并不是一个直观的做法,于是

    var Person = function(info){
        return new Person.fn.init(info);
    }
     
    Person.fn = Person.prototype = {
        constructor: Person,
        init:function(){
            this.name = info.name;
            this.sayHello = function(){
                this.makeArray();
            }
        }
        makeArray:function(){
            console.log(this.name);
        }
    }
    // 这句话的作用 
    // 虽然把makeArray 等常用方法挂载到 Person.prorotype 下面,但还是会被 init 这个实例使用.
    Person.fn.init.prototype = Person.fn;
    

    最后用 闭包 封装起来

    var Person = (function (window) {
        var Person = function (name) {
            return new Person.fn.init(name);
        }
    
        Person.fn = Person.prototype = {
            constructor: Person,
            init: function (name) {
                this.name = name;
                this.sayHello = function () {
                    this.makeArray();
                }
            },
            makeArray: function () {
                console.log(this.name);
            }
        }
    
        Person.fn.init.prototype = Person.fn;
    
        return Person;
    })();
    

    相关文章

      网友评论

          本文标题:类jQuery封装

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