如何避免變量沖突以及相關(guān)處理

2024-09-01 08:30:14

字體：大中小

供稿：網(wǎng)友

AJAX開發(fā)，小編有自己的一些心得體會，也請AJAXer多多指教～那接下來先附上這篇如何避免變量沖突以及相關(guān)處理，一起來了解下其中的詳情吧。

創(chuàng)建XMLHttpRequest對象的代碼如下：?
var?xmlHttp;?
function?createXMLHttpRequest()?{????if?(window.ActiveXObject)?{????????xmlHttp?=?new?ActiveXObject("Microsoft.XMLHTTP");????}?????else?if?(window.XMLHttpRequest)?{????????xmlHttp?=?new?XMLHttpRequest();????}}?
在一般情況下，該代碼的使用不會帶來任何問題。
如：
function?test1(){?createXMLHttpRequest();?xmlHttp.onreadystatechange?=?handleStateChange1;?url?=?"test.php?ts="?+?new?Date().getTime();?xmlHttp.open("GET",?url,?true);?xmlHttp.send(null);}
function?test2(){?createXMLHttpRequest();?xmlHttp.onreadystatechange?=?handleStateChange2;?url?=?"test.php?ts="?+?new?Date().getTime();?xmlHttp.open("GET",?url,?true);?xmlHttp.send(null);}

function?handleStateChange1()?{????......
}

function?handleStateChange2()?{????......
}
..........

在頁面的不同地方調(diào)用test1,test2函數(shù)都能正常工作。即不同時刻調(diào)用的話，就不會產(chǎn)生問題。

但是假如你需要在同一時刻同時調(diào)用這兩個函數(shù)，則會發(fā)現(xiàn)只有其中一個可以正常運(yùn)行。
比如，我在加載頁面的時候運(yùn)行如下函數(shù)：

function?init(){?test1();?test2();}

此時，則test1,test2只有一個函數(shù)會正常執(zhí)行。

分析下原因，是由于javascript的語言特性導(dǎo)致。一般情況下，Javascript的變量，函數(shù)等等，都是公用的，其他對象都能訪問（可讀可寫）。這就是問題的所在。在同一時刻，調(diào)用test1和test2就會出現(xiàn)“變量xmlHttp”的沖突。

解決方法：

1??最簡單的方法，不要在同一時刻調(diào)用，如init函數(shù)可以改為：

function?init(){?test1();?setTimeout("test2()",500);}

???但該方法屬于投機(jī)，并未真正解決問題。

2??修改“XMLHttpRequest創(chuàng)建函數(shù)”，改為一實(shí)例化函數(shù)。

function?createXMLHttpRequest()?{????if?(window.ActiveXObject)?{????????var?xmlHttpObj?=?new?ActiveXObject("Microsoft.XMLHTTP");????}?????else?if?(window.XMLHttpRequest)?{????????var?xmlHttpObj?=?new?XMLHttpRequest();????}?return?xmlHttpObj;}

實(shí)例化時相應(yīng)的改為：

function?test1(){?xmlHttp_1?=?createXMLHttpRequest();?
?xmlHttp_1.onreadystatechange?=?handleStateChange1;?url_1?=?"test.php?ts="?+?new?Date().getTime();?xmlHttp_1.open("GET",?url,?true);?xmlHttp_1.send(null);}

function?test2(){?xmlHttp_2?=?createXMLHttpRequest();?
?xmlHttp_2.onreadystatechange?=?handleStateChange1;?url_2?=?"test.php?ts="?+?new?Date().getTime();?xmlHttp_2.open("GET",?url,?true);?xmlHttp_2.send(null);}

這樣子處理的話，即使在同一時刻調(diào)用test1,test2函數(shù)，也不會產(chǎn)生問題了，實(shí)現(xiàn)了真正的“同步”。?

#######################################################
通過該方法，可以引申出javascript中對象的“私有屬性”的創(chuàng)建方法：
1?私有屬性可以在構(gòu)造函數(shù)中使用?var?關(guān)鍵字定義。
2?私有屬性只能由特權(quán)函數(shù)公用訪問。(特權(quán)函數(shù)就是在構(gòu)造函數(shù)中使用this關(guān)鍵字定義的函數(shù)）。外部客戶可以訪問特權(quán)函數(shù)，而且特權(quán)函數(shù)可以訪問對象的私有屬性。

比如下面這個Vehicle類，則wheelCount和curbWeightInPounds就是私有屬性，只能通過特權(quán)函數(shù)訪問/設(shè)置了：
function?Vehicle()?{????var?wheelCount?=?4;????var?curbWeightInPounds?=?4000;
????this.getWheelCount?=?function()?{????????return?wheelCount;????}
????this.setWheelCount?=?function(count)?{????????wheelCount?=?count;????}
????this.getCurbWeightInPounds?=?function()?{????????return?curbWeightInPounds;????}
????this.setCurbWeightInPounds?=?function(weight)?{????????curbWeightInPounds?=?weight;????}
?}