在
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()
方法后，結果是這樣的：
很方便的是，
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
時代，這是一個嚴重的問題。
posted on 2007-12-22 02:56
crazy 閱讀(211)
評論(0) 編輯 收藏 所屬分類:
javasrcipt