javascript學習筆記(二)－－繼承

原文出處：http://www.blogjava.net/ilovezmh/archive/2007/04/16/111106.html


一、繼承的方式
1.對象冒充
function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function () {
        alert(this.color);
    };
}

function ClassB(sColor, sName) {
    this.newMethod = ClassA;
    this.newMethod(sColor);
    delete this.newMethod;
    
    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };    
}

var objA = new ClassA("red");
var objB = new ClassB("blue", "Nicholas");
objA.sayColor();
objB.sayColor();
objB.sayName();
所有新的屬性和新的方法都必須在刪除了新方法的程式碼後定義。否則，可能會覆蓋超類的相關屬性和方法。
對象冒充可以支援多繼承。
function ClassZ(){
   this.newMethod = ClassX;
   this.newMethod(sColor);
   delete this.newMethod;

   this.newMethod = ClassY;
   this.newMethod(sColor);
   delete this.newMethod;
}
這裡存在一個弊端，如果ClassX和ClassY具有相同的屬性或方法，ClassY具有高優先順序，因為繼承的是最後的類。

2.call()方法
call()方法是與經典的對象冒充方法最相似的方法，它的第一個參數用作this的對象，其他參數都直接傳遞函數自身。
function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function () {
        alert(this.color);
    };
}

function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(color);
    //delete this.newMethod;
    ClassA.call(this, sColor);

    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

var objA = new ClassA("red");
var objB = new ClassB("blue", "Nicholas");
objA.sayColor();
objB.sayColor();
objB.sayName();

3.apply()方法
apply()方法有兩個參數，用作this的對象和要傳遞參數的數組。例如：
function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function () {
        alert(this.color);
    };
}

function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(color);
    //delete this.newMethod;
    ClassA.apply(this, arguments);

    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

var objA = new ClassA("red");
var objB = new ClassB("blue", "Nicholas");
objA.sayColor();
objB.sayColor();
objB.sayName();

當然，只有超類中的參數順序與子類中的參數順序完全一致時才可以傳遞參數對象。如果不是，就必須建立一個單獨的數組，按照正確的順序放置參數。此外，還可以使用call()方法。

4.原型鏈
function ClassA() {
}

ClassA.prototype.color = "red";
ClassA.prototype.sayColor = function () {
    alert(this.color);
};

function ClassB() {
}

ClassB.prototype = new ClassA();

ClassB.prototype.name = "";
ClassB.prototype.sayName = function () {
    alert(this.name);
};

var objA = new ClassA();
var objB = new ClassB();
objA.color = "red";
objB.color = "blue";
objB.name = "Nicholas";
objA.sayColor();
objB.sayColor();
objB.sayName();
注意，調用ClassA的建構函式時，沒有給它傳遞參數。這在原型鏈中是標準做法。要確保建構函式沒有任何參數。
原型鏈的弊端是不支援多重繼承。

5.混合方式
與建立對象最好方式相似，用對象冒充繼承建構函式的屬性，用原型鏈繼承prototype對象的方法。
function ClassA(sColor) {
    this.color = sColor;
}

ClassA.prototype.sayColor = function () {
    alert(this.color);
};

function ClassB(sColor, sName) {
    ClassA.call(this, sColor);
    this.name = sName;
}

ClassB.prototype = new ClassA();

ClassB.prototype.sayName = function () {
    alert(this.name);
};

var objA = new ClassA("red");
var objB = new ClassB("blue", "Nicholas");
objA.sayColor();
objB.sayColor();
objB.sayName();

二、其他繼承方式
1.zlnherit庫
可以從http://www.nczonline.net/downloads處下載
zInherit庫給Object類添加了兩個方法，inheritFrom()和instanceOf()
ClassB.prototype.inheritFrom(ClassA);
CalssB.instanceOf(ClassA);

2.xbObjects庫
可以從http://archive.bclary.com/xbprojectsdocs/xbobject/處下載
第一步，必須註冊類。
_classes.registerClass("Subclass_Name","Superclass_Name");
         這裡，子類和超類名都以字串形式傳進來，而不是指向它們的建構函式的指標。這個調用必須放在指定子類的構造構函數前。
第二步，在建構函式內調用defineClass()方法，傳給它類名及被Clary稱為原型函數的指標，該函數用於初始化對象的所有屬性和方法。
如
_classes.registerClass("ClassA");
function ClassA(color){
   _classes.defineClass("ClassA",prototypeFunction);

   function prototypeFunction(){
      //...
   }
}
第三步，為該類建立init()方法。該方法負責設定該類的所有屬性，它必須接受與建構函式相同的參數。作為一種規約，init()方法總是在defineClass()方法後調用。
_classes.registerClass("ClassA");
function ClassA(color){
   _classes.defineClass("ClassA",prototypeFunction);
   this.init(sColor);
   function prototypeFunction(){
     ClassA.prototype.init = function(sColor){
         this.parentMethod("init");
         this.color = sColor;
      }
   }
}
第四步，在原型函數內添加其他類的方法。
_classes.registerClass("ClassA");
function ClassA(color){
   _classes.defineClass("ClassA",prototypeFunction);
   this.init(sColor);
   function prototypeFunction(){
     ClassA.prototype.init = function(sColor){
         this.parentMethod("init");
         this.color = sColor;
      }
      ClassA.prototype.sayColor = function(){
         alert(this.color);
      }
   }
}
然後，即可以以常規方式建立ClassA的執行個體
var objA = new ClassA("red");
objA.sayColor();      //outputs "res"