關於JavaScript中實現繼承，及prototype屬性

感謝Mozilla 讓我弄懂繼承。

JavaScript有八種基本類型，函數屬於object。所以所有函數都繼承自object。//擴展：對象，基本上 JavaScript 里的任何東西都是對象，而且都可以被儲存在變數里。將這個記在腦子裡。

但是JavaScript並沒有真正意義上的繼承。而是類似於指向和複製。並且每個函數和對象都有prototype屬性。（"原型鏈"（prototype chain）模式）

所有就構造瞭如同樹結構一般的原型鏈。

常見的幾種繼承方法：

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("blue");
var objB = new ClassB("red", "John");
objA.sayColor();    //輸出 "blue"
objB.sayColor();    //輸出 "red"
objB.sayName();//輸出 "John"

以上代碼，主要的在標紅部分，先解釋ClassB函數體中標紅第一句：

this.newMethod = ClassA;
this是指的當前對象的擁有者。代碼，this.newMethod = ClassA在ClassB的函數體中。
假如我var v=new ClassB();//ClassB函數體中的this就指代的v，因為v是ClassB函數體的擁有者。
//以上代碼，具體經歷了哪些步驟，我們先分析一下：
this肯定是指的ClassB。所以this.newMethod 可以就解釋為ClassB新建一個newMethod屬性並且賦值ClassA。//this.XXX快速建立一個屬性，或者修改屬性值

接著解釋ClassB標紅第二句：

this.newMethod(sColor);
關鍵在這第二句，代碼上的this毋庸置疑肯定是指的ClassB。具體執行表示：執行newMethod函數。//就是執行ClassA
//步驟解釋
newMethod既然賦值為ClassA，那newMethod就有ClassA所有屬性和方法

function newMethod(sColor) {
    this.color = sColor;
    this.sayColor = function () {
        alert(this.color);
    };
}

之前說過，this當前對象擁有者，newMethod是ClassB的屬性，所有newMethod函數體中的this指代的是ClassB

執行函數體中的代碼就是，ClassB.color=Scolor;ClassB.sayColor=function...;//動態添加屬性

ClassB中的第三句：

 delete this.newMethod;//刪除屬性
既然我ClassB已經擁有了ClassA中的方法和屬性了，newMethod對ClassB已經沒有用了。

2.

function ClassA() {
    this.color = "red";
    this.sayColor = function () {
        console.log(this.color);
    };
}
ClassA.prototype.height=100;
function ClassB() {
    this.color="bule";
}
ClassB.prototype=new ClassA();
ClassB.prototype.width=200;
var b =new ClassB();
b.sayColor();//bule

如下例：

 var BaseCalculator = function() {
        this.t=2;
    };//這是一個構造函數

    BaseCalculator.prototype = {
        add: function(x, y) {
            return x + y;
        },
        subtract: function(x, y) {
            return x - y;
        }
    };
    var Calculator = function () {
        //為每個實例都聲明一個數字
       this.tax = 5;
    };

    Calculator.prototype = new BaseCalculator();//繼承
   //Calculator.prototype.constructor=Calculator;
   Calculator.prototype.add = function (x, y) {
        return x + y + this.tax;
    };

（樣式圖 根據上代碼畫圖）

如樣式圖--詳細解釋