類jQuery封裝

這種方式是我從 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;
})();
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容