如何在javascript實現OO編程？恐怕最好的方式就是充分利用PRototype屬性。關于prototype的介紹有很多，我就不贅述了。比較基本的原理是，當你用prototype編寫一個類后，當你new一個新的object，瀏覽器會自動把prototype中的內容替你附加在object上。這樣，通過利用prototype，你也就實現了類似OO的Javascript。在Javascript中，object就是一個associative array。一個function就是一個類。當你編寫如下function時，其實就是定義了一個類，該function就是它的構造函數。function MyObject(name, size) { this.name = name; this.size = size; }
之后，你可以方便的通過MyObject類的prototype屬性來方便的擴充它。比如，你可以給他添加其他的屬性和方法。 MyObject.prototype.tellSize = function()
{ return "size of "+this.name+" is "+this.size; } MyObject.prototype.color = "red"; MyObject.prototype.tellColor = function() { return "color of "+this.name+" is "+this.color; } var myobj1 = new MyObject("tiddles", "7.5 meters");
domDiv.innerHtml += myobj1.tellColor()+"<br /><br />";
你可以想象，當你調用tellColor()方法后，結果是這樣的：color of tiddles is red
很方便的是，prototype屬性可以動態添加。比如，你需要往MyObject中加入一個height屬性，并希望其提供一個tellHeight()方法來獲得height屬性的值。你可以在上面的代碼后，繼續添加如下的代碼： MyObject.prototype.height = "2.26 meters"; MyObject.prototype.tellHeight = function() { return "height of "+this.name+" is "+this.height; }
之后，你可以訪問一下myobj1的tellHeight()方法，你可以得到如下的結果：
height of tiddles is 2.26 meters
prototype的這些動態的特性看起來有些迷人，不過我倒是反而覺得有些涼颼颼的。確實，這些特性給你很大的靈活性，可以給與你runtime改變類屬性和方法的能力。不過，稍微發掘一下，會有些不良的習慣產生。首先，假如可以動態添加屬性和方法，那么很輕易讓人想到，當我調用時，我想要調用的屬性或者方法存在不？這是一個很嚴厲的問題，假如當我們調用時根本沒有該屬性或者方法，將可能導致我們的腳本down掉。不過也有解決辦法。比如，在上面的代碼中，當還沒有tellHeight()方法時，我們可以如下編寫代碼避免發生錯誤： if (myobj1.tellHeight) { domDiv.innerHTML += myobj1.tellHeight()+"<br /><br />"; }
注重，一定要在if語句中，不要加方法后面的那對()，否則，直接就down掉了。有愛好的讀者可以打印一下，看看分別訪問myobj1.tellHeight和myobj1.tellHeight()時有什么區別。也許，你覺得這個是小意思。加個判定嘛，不就好了？對，但是下面一個問題更令人頭痛。屬性和方法在不在的問題簡單，可是屬性和方法變不變化的問題可就嚴重了。在不在我們可以檢測，變不變呢？比如，請看下面的代碼：
function MyObject(name, size) { this.name = name; this.size = size; } MyObject.prototype.color = "red"; MyObject.prototype.tellColor = function() { return "color of "+this.name+" is "+this.color;
} var myobj1 = new MyObject("tiddles", "7.5 meters"); domDiv.innerHTML += myobj1.tellColor()+"<br /><br />"; MyObject.prototype.color = "green"; domDiv.innerHTML += myobj1.tellColor()+"<br /><br />";
該代碼將產生如下結果：color of tiddles is red
color of tiddles is green
請注重，你修改的是類MyObject的color屬性。但是你驚異的看到你之前實例化的對象myobj1的屬性值竟然也變化了。天！假如你的項目代碼是多人合作，那么，也許某個人會在編程時為了圖一己之便，擅自修改你的類。于是，所有人的對象都變化了。于是，你們陷入了漫長的debug過程中。。。。。。（不要說我沒有告訴你啊）
上面是屬性，還有方法： function MyObject(name, size) { this.name = name; this.size = size; } MyObject.prototype.color = "red"; MyObject.prototype.tellColor = function() { return "color of "+this.name+" is "+this.color;
} var myobj1 = new MyObject("tiddles", "7.5 meters"); domDiv.innerHTML += myobj1.tellColor()+"<br /><br />"; MyObject.prototype.color = "green"; MyObject.prototype.tellColor = function() { return "your color of "+this.name+" is "+this.color; }
domDiv.innerHTML += myobj1.tellColor()+"<br /><br />";
這段代碼的結果是：color of tiddles is red
your color of tiddles is green
哈？原來方法也能變，汗！問題來了。Javascript太靈活的編程方式多少讓人不適應。假如整個Team的水平都比較高還可以，沒人會犯這樣的錯誤。但是，當有個毛頭小伙子不知情，擅自修改類，將導致所有的人的對象都發生變化，無論是屬性還是方法。在Javascript代碼變得越來越多的Ajax時代，這是一個嚴重的問題。這說明，編寫Javascript時，好的編程風格更加重要。記得某人曾經說過這樣的話，想Java和C#這些比較嚴格的語言，雖然降低了靈活性，但也減少了犯錯誤的可能。這樣，即使一個新手，他寫出的代碼也不會與高手差太多。但是，像Javascript這樣的腳本語言，由于太靈活，所以，高手寫出的是天使，而新手寫的，可能是魔鬼！CoofUCoo Zhang4/23/2006
