摘要：實(shí)現(xiàn)類(lèi)的步驟第一步是使用新建類(lèi)，初始化的固定函數(shù)是，不能使用其它名稱(chēng)子類(lèi)也是使用新建，父類(lèi)在子類(lèi)中，使用來(lái)繼承，與子類(lèi)的方法名，同一級(jí)別子類(lèi)中與父類(lèi)的同名方法，如果需要在父類(lèi)的同名方法上拓展，需要在子類(lèi)的同名方法內(nèi)，使用如果需要在類(lèi)的外面增

實(shí)現(xiàn)類(lèi)的步驟

第一步是使用new Class新建類(lèi)，初始化的固定函數(shù)是initialize，不能使用其它名稱(chēng)

子類(lèi)也是使用new Class新建，父類(lèi)在子類(lèi)中，使用Extends:parentClass來(lái)繼承，Extends與子類(lèi)的方法名，同一級(jí)別

子類(lèi)中與父類(lèi)的同名方法，如果需要在父類(lèi)的同名方法上拓展，需要在子類(lèi)的同名方法內(nèi)，使用this.parent(args)

如果需要在類(lèi)的外面增加方法，可以使用implement方法

// 使用 Class.create 創(chuàng)建類(lèi)
    var Person = new Class({
        // 初始函數(shù)固定為 initialize,
        initialize:function(name) {
            this.name = name;
            this.friends = ["jack", "mark"];
        },
        getName: function(){
            console.log("My name is " + this.name);
        },
        setFriends:function(friend){
            this.friends.push(friend);
        },
        getFriends:function(){
            console.log(this.friends)
        }
    });

    // 使用 implement 給類(lèi)添加方法，子類(lèi)可以繼承該方法
    Person.implement({
        getAge:function(age){
            console.log("My age is " + age);
        }
    })

    // 子類(lèi)通過(guò) new Class 創(chuàng)建類(lèi)
    var Chinese = new Class({
        // 子類(lèi)通過(guò) Extends 來(lái)繼承父類(lèi)
        Extends:Person,
        initialize:function(name, addr){
            this.parent(name);
            this.addr = addr;
        },
        getAddr:function(){
            console.log("My address is " + this.addr);
        }
    });

    var Japanese = new Class({
        Extends:Person,
        initialize:function(name){
            this.parent(name);
        }
    })

    // 實(shí)例化類(lèi)
    var men = new Chinese("allen", "BeiJing");
    men.getName(); // My name is allen
    men.getAge(23); // My age is 23
    men.getAddr(); // My address is BeiJing

    // 以下驗(yàn)證 - 子類(lèi)繼承父類(lèi)的屬性，修改了之后，其他子類(lèi)再次繼承父類(lèi)，父類(lèi)的屬性的值為何不會(huì)改變
    var allen = new Person();
    allen.getFriends(); // ["jack", "mark"]

    var women = new Japanese();
    women.setFriends("lisa");
    women.getFriends(); // ["jack", "mark", "lisa"]

    var men = new Chinese();
    men.setFriends("peter");
    men.getFriends(); //["jack", "mark", "peter"]

    var wallen = new Person();
    wallen.getFriends(); //["jack", "mark"]

JS是如何實(shí)現(xiàn)類(lèi)的方法，有幾個(gè)重要的問(wèn)題需要搞清楚

JS是如何創(chuàng)建類(lèi)的

子類(lèi)是如何實(shí)現(xiàn)繼承父類(lèi)屬性和方法的

子類(lèi)繼承父類(lèi)的屬性，修改了之后，其他子類(lèi)再次繼承父類(lèi)，父類(lèi)的屬性的值為何不會(huì)改變

子類(lèi)和父類(lèi)的同名函數(shù)，使用this.parent(args)在函數(shù)中使用，是如何做到在子類(lèi)中的同名函數(shù)共存的

如何實(shí)現(xiàn)，不在類(lèi)中，而是使用implement往類(lèi)中添加方法的

下面來(lái)通過(guò)Mootools.js的class來(lái)具體分析

(function(){

    // 新建一個(gè) Class 的類(lèi)，new Type 也是一個(gè)函數(shù)
var Class = this.Class = new Type("Class", function(params){
    // 如果傳入的 參數(shù)是方法，就把該函數(shù)當(dāng)作初始化的方法
    if (instanceOf(params, Function)) params = {initialize: params};

    var newClass = function(){
        // 解除屬性里對(duì)其他對(duì)象的引用
        reset(this);
        // 如果當(dāng)前類(lèi)正在構(gòu)建，就返回當(dāng)前類(lèi)，不做任何操作
        if (newClass.$prototyping) return this;
        // $caller 和 $family 是什么啊
        this.$caller = null;
        this.$family = null;
        // 有初始化函數(shù)的話(huà)，就傳入?yún)?shù)到該初始化函數(shù)，沒(méi)有就返回自身
        var value = (this.initialize) ? this.initialize.apply(this, arguments) : this;
        // 這句又是什么意思，一個(gè) $caller ，一個(gè) caller
        this.$caller = this.caller = null;
        return value;
        // extend(this) 把類(lèi)的方法，都添加到當(dāng)前新建的類(lèi)中
        // implement(params) 把 params 的所有方法都添加到當(dāng)前類(lèi)中
    }.extend(this).implement(params);

    //指定 constructor ，以便使用 instanceOf 來(lái)驗(yàn)證
    newClass.$constructor = Class;
    newClass.prototype.$constructor = newClass;
    // 指定當(dāng)前類(lèi)的父類(lèi)是哪一個(gè)
    newClass.prototype.parent = parent;

    return newClass;
});

/*
    在子類(lèi)擁有和父類(lèi)同名方法時(shí)，使用 this.parent(args) 方法來(lái)調(diào)用父類(lèi)的該方法
 */
var parent = function(){
    // :: 如果當(dāng)前方法沒(méi)有被調(diào)用，那么就說(shuō)，parent 方法沒(méi)有被調(diào)用
    if (!this.$caller) throw new Error("The method "parent" cannot be called.");
    // 當(dāng)前函數(shù)被調(diào)用的名字 function person(age) { this.age = age }，則 age 被調(diào)用的就是 person 函數(shù)，就是得到 person 這個(gè)名字
    var name = this.$caller.$name,
        // $owner 當(dāng)前類(lèi)對(duì)象, 得到當(dāng)前類(lèi)對(duì)象的父類(lèi)對(duì)象
        parent = this.$caller.$owner.parent,
        // 得到父類(lèi)相同名字的方法
        previous = (parent) ? parent.prototype[name] : null;
    if (!previous) throw new Error("The method "" + name + "" has no parent.");
    // 父類(lèi)的該同名函數(shù)，添加到當(dāng)前子類(lèi)中
    return previous.apply(this, arguments);
};

// 解除屬性里對(duì)其他對(duì)象的引用
// 這個(gè)解除的例子，可以看 http://hmking.blog.51cto.com/3135992/675856
var reset = function(object){
    for (var key in object){
        var value = object[key];
        switch (typeOf(value)){
            case "object":
                var F = function(){};
                F.prototype = value;
                object[key] = reset(new F);
                break;
            case "array": object[key] = value.clone(); break;
        }
    }
    return object;
};

var wrap = function(self, key, method){
    if (method.$origin) method = method.$origin;
    var wrapper = function(){
        // 如果方法是是被保護(hù)的，或者這個(gè)方法沒(méi)有 caller ，就不能被調(diào)用
        if (method.$protected && this.$caller == null) throw new Error("The method "" + key + "" cannot be called.");
        var caller = this.caller, current = this.$caller;
        this.caller = current; this.$caller = wrapper;
        // 將 method 綁定到當(dāng)前對(duì)象中
        var result = method.apply(this, arguments);
        this.$caller = current; this.caller = caller;
        return result;
        // 通過(guò)extend ,把當(dāng)前函數(shù)的屬性附加到 self 里去
    }.extend({$owner: self, $origin: method, $name: key});
    return wrapper;
};

var implement = function(key, value, retain){
    //  Mutators 的 key 只有 Extends 和 Implements
    if (Class.Mutators.hasOwnProperty(key)){
        value = Class.Mutators[key].call(this, value);
        if (value == null) return this;
    }

    if (typeOf(value) == "function"){
        // 隱藏的方法子類(lèi)就不要再繼承使用了
        // $hidden 和 $protected 去看函數(shù)那章
        if (value.$hidden) return this;
        this.prototype[key] = (retain) ? value : wrap(this, key, value);
    } else {
        // merge 應(yīng)該是同名的函數(shù)，這樣就直接添加進(jìn)去就好
        Object.merge(this.prototype, key, value);
    }

    return this;
};

// 為了將父類(lèi)的的屬性繼承到子類(lèi)，會(huì)使用中間變量，將父類(lèi)傳遞給中間變量，再通過(guò)中間變量傳遞給子類(lèi)
var getInstance = function(klass){
    // 誰(shuí)知當(dāng)前當(dāng)前類(lèi)正在構(gòu)建
    klass.$prototyping = true;

    var proto = new klass;
    // 這里就刪除 $prototyping ,也就是構(gòu)建的過(guò)程就是上面這一行咯
    delete klass.$prototyping;
    return proto;
};

// 這里有 overloadSetter ，所以，可能是 Class.implement 方法，來(lái)給類(lèi)額外添加函數(shù)的
Class.implement("implement", implement.overloadSetter());

Class.Mutators = {

    // 傳給 extends 的參數(shù)是 parent
    Extends: function(parent){
        // 指向當(dāng)前類(lèi)的父類(lèi)是 parent 參數(shù)
        this.parent = parent;
        // 使用 getInstance 得到父類(lèi)的全部方法
        this.prototype = getInstance(parent);
    },

    Implements: function(items){
        Array.convert(items).each(function(item){
            var instance = new item;
            for (var key in instance) implement.call(this, key, instance[key], true);
        }, this);
    }
};

})();
/*
 Extends 其實(shí)是分兩部分，使用 Extends 的時(shí)候，是把父類(lèi)的所有屬性和方法，通過(guò) getInstance 來(lái)附加到當(dāng)前類(lèi)中
 然后當(dāng)前類(lèi)的方法中，可以使用 this.parent(args) 方法，來(lái)把父類(lèi)的同名方法加載進(jìn)來(lái)

 Implements 方法中沒(méi)有指代 this.parent = parent ，所以如果當(dāng)前類(lèi)寫(xiě)了和父類(lèi)同名的方法，就會(huì)覆蓋父類(lèi)的方法
 Implements 只是給當(dāng)前類(lèi)添加更多的方法
 */

JS面向?qū)ο笙盗?/p>

《javascript高級(jí)程序設(shè)計(jì)》 繼承實(shí)現(xiàn)方式

prototype.js 是如何實(shí)現(xiàn)JS的類(lèi)以及類(lèi)的相關(guān)屬性和作用

klass 是如何實(shí)現(xiàn)JS的類(lèi)以及類(lèi)的相關(guān)屬性和作用

總結(jié)：prototype.js，Mootools.js和klass.js 實(shí)現(xiàn)類(lèi)的方法的異同與優(yōu)劣