DIV CSS 佈局教程網

關於JavaScript構造函數，如今出現了很多JavaScript的框架，例如jQuery、Ext等等這些，這些將JavaScript作為一種面向對象的語言進行編程，那麼JavaScript到底是怎麼樣實現面向對象的一些特征的呢，首先，我們來看看JavaScript怎麼樣來定義一個構造函數。

function A(x)
{
this.x = x;
}
var obj = new A(5);
alert(obj.x);

這段代碼十分簡單，但是我們重要的是看到了一個十分驚訝的結果，obj被我們賦予了一個屬性x，就如同我們在C#中使用某個類的實例的時候一樣。那麼這個屬性是怎麼樣產生的呢？

關鍵語句：this.x=x。這句話就是進行一個屬性的申明與賦值，這裡，我們肯定會問到，this是什麼？為什麼可以使用this.x來進行申明與賦值屬性呢？

其實this代表的就是我們剛剛實例化出來的obj，就相當於我們使用obj去調用了構造函數A裡面的屬性、方法等等。

那麼，我們怎麼樣去在構造函數中定義一個方法呢？

function A(x,y)
{
this.x = x;
this.y = y;
A.prototype.FunX = function(){alert(x)};
A.prototype.FunY = function(){alert(y)};
}
var obj = new A(5,10);
alert(obj.x);
alert(obj.y);
obj.FunX();
obj.FunY();

執行的結果十分簡單，彈出5、10、5、10的結果，可以看到

A.prototype.FunX = function(){alert(x)};
A.prototype.FunY = function(){alert(y)};

這兩句代碼定義了兩個方法，分別是FunX和FunY。那麼，如果現在出現了一種情況，如果我們需要臨時的給A函數添加方法怎麼辦呢？

function A(x,y)
{
this.x = x;
this.y = y;
}
A.prototype.FunX = function(){alert("5")};
var obj = new A(5,10);
alert(obj.x);
alert(obj.y);
obj.FunX();
A.prototype.FunY = function(){alert("10")};
obj.FunY();

運行這段代碼，我們可以看到，彈出的結果還是和以前的結果一樣，但是我們將兩個方法都定義在了外邊，而且方法FunY是定義在實例化之後的，那麼這裡大家看出來了什麼沒？很顯然，在我們使用obj.FunY()語句時候，代碼會重新的去構造一下obj，然後再來執行此方法，那麼如果代碼改成這樣？

obj.FunY();
A.prototype.FunY = function(){alert("10")};

很顯然，FunY()就不會去執行方法了。