讀書筆記-1【javascript語言精粹】繼承

malakashi 發(fā)布于2019-08-23 18:06 / 624人閱讀

摘要：使用構(gòu)造器有個嚴(yán)重的危害，如果在調(diào)用構(gòu)造器函數(shù)的時候忘記使用前綴，不僅不會綁定到新對象，還會污染全局變量原型模式原型模式中，我們采用對象來繼承。

構(gòu)造器調(diào)用模式

當(dāng)一個函數(shù)對象被創(chuàng)建時，F(xiàn)unction構(gòu)造器會運(yùn)行類似這樣的代碼：

this.prototype = {constructor: this}

new一個函數(shù)事會發(fā)生：

Function.method("new", function() {
    // 創(chuàng)建新對象，繼承原型
    let that = Object.create(this.prototype);
    // 調(diào)用構(gòu)造函數(shù)，綁定this到新對象
    let res = this.apply(that, arguments);
    return typeof res === "object" && res || that;
});

偽類繼承

let Mammal = function(name) {
    this.name = name;
}
Mammal.prototype.get_name = function() {
    return this.name;
}

// 構(gòu)造一個實(shí)例
let myMammal = new Mammal("zhangsan");
// 利用偽類繼承Mammal
let Cat = function(name) {
    this.name = name;
    this.age = age;
}

Cat.prototype = new Mammal();
Cat.prototype.get_age = function() {
    return this.age;
}

let myCat = new Cat("miao");

以上就是一個簡單的偽類繼承。使用構(gòu)造器有個嚴(yán)重的危害，如果在調(diào)用構(gòu)造器函數(shù)的時候忘記使用new前綴，this不僅不會綁定到新對象，還會污染全局變量；

原型模式

原型模式中，我們采用對象來繼承。

let myMammal = {
    name: "aa",
    age: 22,
    get_name: function() {
        return this.name;
    }
}

let myCat = Object.create(myMammal);
Cat.get_age = function() {
    return this.age;
}

這種繼承方式，導(dǎo)致沒有私有屬性和私有函數(shù)

函數(shù)化模式

它的每一層都是在擴(kuò)充that

Function.prototype.method = function (name,func) {
    this.prototype[name] = func;
    return this; 
}
// 工廠mammal函數(shù)
var mammal = function (spec) {
    var that = {};

    that.get_name = function () {
        return spec.name;
    }
    that.says = function (spec) {
        return spec.saying || "";
    } 

    return that;
}

// 工廠cat函數(shù)(基于mammal的函數(shù))
var cat = function (spec) {
    spec.saying = spec.saying || "meow";
    // 直接調(diào)用mammal函數(shù)
    var that = mammal(spec);
    that.purr = function (n) {
        var i, s = "";
        for (i = 0; i < n; i += 1) {
            if(s) {
                s += "-";
            }
            s += "r";
        }
    }
    that.get_name = function () {
        return that.says() + " " + spec.name + " " + that.says();
    }
    return that;
}

// 創(chuàng)建myCat對象
var myCat = cat({name: "Henrietta"});

Object.method("superior",function (name) {
    var that = this,
        method = that[name];
    return function () {
        return method.apply(that, arguments)
    }
})

// 工廠coolcat函數(shù)(基于cat函數(shù))
var coolcat = function (spec) {
    var that = cat(spec),
        super_get_name = that.superior("get_name");
    that.get_name = function (n) {
        return "like " + super_get_name() + " baby";
    }
    return that;
}

var myCoolCat = coolcat({name : "Bix"});

var name = myCoolCat.get_name();

部件

沒看懂。。

let eventuality = function(that) {
    let registry = {};
    that.fire = function(event) {
        let array, 
            func,
            handler,
            i,
            type = typeof event === "string" ? event : event.type;
        if (registry.hasOwnProperty(type)) {
            array = registry[type];
            for(i = 0; i < array.length; i++) {
                handler = array[i];
                func = handler.method;
                if (typeof func === "string") {
                    func = this[func];
                }
                func.apply(this, handler.parameters || [events]);
            }
        }
        return this;
            
    }
    that.on = function(type, method, parameters) {
        let handler= {
            method,
            parameters
        };
        if (registry.hasOwnProperty(type)) {
            registry[type].push(handler);
        } else {
            registry[type] = [handler];
        }
        return this;
    }
    return that;
}