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

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

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

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

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

如果需要在類的外面增加方法，可以使用implement方法

// 使用 Class.create 創(chuàng)建類
    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 給類添加方法，子類可以繼承該方法
    Person.implement({
        getAge:function(age){
            console.log("My age is " + age);
        }
    })

    // 子類通過 new Class 創(chuàng)建類
    var Chinese = new Class({
        // 子類通過 Extends 來繼承父類
        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í)例化類
    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)證 - 子類繼承父類的屬性，修改了之后，其他子類再次繼承父類，父類的屬性的值為何不會(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)類的方法，有幾個(gè)重要的問題需要搞清楚

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

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

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

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

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

下面來通過Mootools.js的class來具體分析

(function(){

    // 新建一個(gè) Class 的類，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)前類正在構(gòu)建，就返回當(dāng)前類，不做任何操作
        if (newClass.$prototyping) return this;
        // $caller 和 $family 是什么啊
        this.$caller = null;
        this.$family = null;
        // 有初始化函數(shù)的話，就傳入?yún)?shù)到該初始化函數(shù)，沒有就返回自身
        var value = (this.initialize) ? this.initialize.apply(this, arguments) : this;
        // 這句又是什么意思，一個(gè) $caller ，一個(gè) caller
        this.$caller = this.caller = null;
        return value;
        // extend(this) 把類的方法，都添加到當(dāng)前新建的類中
        // implement(params) 把 params 的所有方法都添加到當(dāng)前類中
    }.extend(this).implement(params);

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

    return newClass;
});

/*
    在子類擁有和父類同名方法時(shí)，使用 this.parent(args) 方法來調(diào)用父類的該方法
 */
var parent = function(){
    // :: 如果當(dāng)前方法沒有被調(diào)用，那么就說，parent 方法沒有被調(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)前類對(duì)象, 得到當(dāng)前類對(duì)象的父類對(duì)象
        parent = this.$caller.$owner.parent,
        // 得到父類相同名字的方法
        previous = (parent) ? parent.prototype[name] : null;
    if (!previous) throw new Error("The method "" + name + "" has no parent.");
    // 父類的該同名函數(shù)，添加到當(dāng)前子類中
    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è)方法沒有 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;
        // 通過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"){
        // 隱藏的方法子類就不要再繼承使用了
        // $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;
};

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

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

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

Class.Mutators = {

    // 傳給 extends 的參數(shù)是 parent
    Extends: function(parent){
        // 指向當(dāng)前類的父類是 parent 參數(shù)
        this.parent = parent;
        // 使用 getInstance 得到父類的全部方法
        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í)候，是把父類的所有屬性和方法，通過 getInstance 來附加到當(dāng)前類中
 然后當(dāng)前類的方法中，可以使用 this.parent(args) 方法，來把父類的同名方法加載進(jìn)來

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

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

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

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

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

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