在
Javascript
中，
object
就是一個(gè)
associative array
。一個(gè)
function
就是一個(gè)類。當(dāng)你編寫如下
function
時(shí)，其實(shí)就是定義了一個(gè)類，該
function
就是它的構(gòu)造函數(shù)。
function MyObject(name, size)
?????? {
????????????? this.name = name;
????????????? this.size = size;
?????? }
之后，你可以方便的通過
MyObject
類的
prototype
屬性來方便的擴(kuò)充它。比如，你可以給他添加其他的屬性和方法。
?????? 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 />";
你可以想象，當(dāng)你調(diào)用
tellColor()
方法后，結(jié)果是這樣的：
很方便的是，
prototype
屬性可以動(dòng)態(tài)添加。比如，你需要往
MyObject
中加入一個(gè)
height
屬性，并希望其提供一個(gè)
tellHeight()
方法來獲得
height
屬性的值。你可以在上面的代碼后，繼續(xù)添加如下的代碼：
?????? MyObject.prototype.height = "2.26 meters";
?????? MyObject.prototype.tellHeight = function()
?????? {
????????????? return "height of "+this.name+" is "+this.height;
?????? }
之后，你可以訪問一下
myobj1
的
tellHeight()
方法，你可以得到如下的結(jié)果：
height of tiddles is 2.26 meters
prototype
的這些動(dòng)態(tài)的特性看起來有些迷人，不過我倒是反而覺得有些涼颼颼的。確實(shí)，這些特性給你很大的靈活性，可以給與你
runtime
改變類屬性和方法的能力。不過，稍微發(fā)掘一下，會(huì)有些不良的習(xí)慣產(chǎn)生。
首先，如果可以動(dòng)態(tài)添加屬性和方法，那么很容易讓人想到，當(dāng)我調(diào)用時(shí)，我想要調(diào)用的屬性或者方法存在不？這是一個(gè)很嚴(yán)肅的問題，如果當(dāng)我們調(diào)用時(shí)根本沒有該屬性或者方法，將可能導(dǎo)致我們的腳本
down
掉。
不過也有解決辦法。比如，在上面的代碼中，當(dāng)還沒有
tellHeight()
方法時(shí)，我們可以如下編寫代碼避免發(fā)生錯(cuò)誤：
?????? if (myobj1.tellHeight)
?????? {
????????????? domDiv.innerHTML += myobj1.tellHeight()+"<br /><br />";
?????? }
注意，一定要在
if
語句中，不要加方法后面的那對(duì)
()
，否則，直接就
down
掉了。有興趣的讀者可以打印一下，看看分別訪問
myobj1.tellHeight
和
myobj1.tellHeight()
時(shí)有什么區(qū)別。
也許，你覺得這個(gè)是小意思。加個(gè)判斷嘛，不就好了？
對(duì)，但是下面一個(gè)問題更令人頭痛。
屬性和方法在不在的問題簡(jiǎn)單，可是屬性和方法變不變化的問題可就嚴(yán)重了。在不在我們可以檢測(cè)，變不變呢？比如，請(qǐng)看下面的代碼：
?????? 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 />";
該代碼將產(chǎn)生如下結(jié)果：
color of tiddles is red
color of tiddles is green
請(qǐng)注意，你修改的是類
MyObject
的
color
屬性。但是你驚奇的看到你之前實(shí)例化的對(duì)象
myobj1
的屬性值竟然也變化了。天！如果你的項(xiàng)目代碼是多人合作，那么，也許某個(gè)人會(huì)在編程時(shí)為了圖一己之便，擅自修改你的類。于是，所有人的對(duì)象都變化了。于是，你們陷入了漫長(zhǎng)的
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 />";
這段代碼的結(jié)果是：
color of tiddles is red
your color of tiddles is green
哈？原來方法也能變，汗！
問題來了。
Javascript
太靈活的編程方式多少讓人不適應(yīng)。如果整個(gè)
Team
的水平都比較高還可以，沒人會(huì)犯這樣的錯(cuò)誤。但是，當(dāng)有個(gè)毛頭小伙子不知情，擅自修改類，將導(dǎo)致所有的人的對(duì)象都發(fā)生變化，無論是屬性還是方法。在
Javascript
代碼變得越來越多的
Ajax
時(shí)代，這是一個(gè)嚴(yán)重的問題。
posted on 2007-12-22 02:56
crazy 閱讀(214)
評(píng)論(0) 編輯 收藏 所屬分類:
javasrcipt