理運(yùn)用命名空間讓js不產(chǎn)生沖突避免全局變量的泛濫
更新時(shí)間:2014年06月15日 11:26:12 投稿:whsnow
為了避免變量之間的覆蓋與沖突,可以生成命名空間,命名空間是一種特殊的前綴,在不同的匿名函數(shù)中,根據(jù)功能聲明一個(gè)不同的命名空間
為了避免變量之間的覆蓋與沖突,可以生成命名空間,命名空間是一種特殊的前綴,在js中,通過(guò){ }對(duì)象實(shí)現(xiàn)。
在不同的匿名函數(shù)中,根據(jù)功能聲明一個(gè)不同的命名空間,每個(gè)匿名函數(shù)中GLOBAL對(duì)象的屬性都不直接掛在GLOBAL上,而是掛在次匿名函數(shù)的命名空間下,如:
<script type="text/javascript">
var GLOBAL={}
</script>
<script type="text/javascript">
(function(){
var a=123, a1=256;
GLOBAL.A={}
GLOBAL.A.str=a;
})();
</script>
<script type="text/javascript">
(function(){
var b1=123, b2=256;
GLOBAL.B={}
GLOBAL.B.str=a;
})();
</script>
如果同一個(gè)匿名函數(shù)中的程序非常復(fù)雜,變量名很多,命名空間可以進(jìn)一步擴(kuò)展,生成二級(jí)命名空間:
<script type="text/javascript">
var GLOBAL={}
</script>
<script type="text/javascript">
(function(){
var a=123, a1=256;
GLOBAL.A={};
GLOBAL.A.CAT={};
GLOBAL.A.DOG={};
GLOBAL.A.CAT.name="mini";
GLOBAL.A.CAT.move=function(){
}
GLOBAL.A.DOG.name="mini";
GLOBAL.A.DOG.move=function(){
}
})();
</script>
因生成命名空間是非常常用的功能,可以進(jìn)一步將生成命名空間的功能定義成一個(gè)函數(shù),方便調(diào)用,如下:
<script type="text/javascript">
var GLOBAL={}
GLOBAL.namespace=function(str){
var arr=str.split("."), o=GLOBAL;
for(i=arr[0]=="GLOBAL"?1:0;i<arr.length; i++){
o[arr[i]]=o[arr[i]] || {};
o=o[arr[i]];
}
}
</script>
調(diào)用命名空間具體操作:
<script type="text/javascript">
//=============================================================
// 功能A
// 工程師甲
// email:ctkl68945@gmail.com msn:ctkl68945@hotmail.com"
// 2012-11-06
//=============================================================
(function(){
var a=123, a1="hello world";
GLOBAL.namespace("A.CAT");
GLOBAL.namespace("A.DOG");
GLOBAL.A.CAT.name="mini";
GLOBAL.A.CAT.move=function(){
}
GLOBAL.A.DOG.name="mini";
GLOBAL.A.DOG.move=function(){
}
GLOBAL.A.str=a;
GLOBAL.A.str1=a1;
})();
依次類似,無(wú)論多人的直接團(tuán)隊(duì)開發(fā),還是個(gè)人的間接團(tuán)隊(duì)合作,都需要良好的可維護(hù)性。
1、添加必要的代碼注釋
2、讓JS不產(chǎn)生沖突,需避免全局變量的泛濫,合理使用命名空間
在不同的匿名函數(shù)中,根據(jù)功能聲明一個(gè)不同的命名空間,每個(gè)匿名函數(shù)中GLOBAL對(duì)象的屬性都不直接掛在GLOBAL上,而是掛在次匿名函數(shù)的命名空間下,如:
復(fù)制代碼 代碼如下:
<script type="text/javascript">
var GLOBAL={}
</script>
<script type="text/javascript">
(function(){
var a=123, a1=256;
GLOBAL.A={}
GLOBAL.A.str=a;
})();
</script>
<script type="text/javascript">
(function(){
var b1=123, b2=256;
GLOBAL.B={}
GLOBAL.B.str=a;
})();
</script>
如果同一個(gè)匿名函數(shù)中的程序非常復(fù)雜,變量名很多,命名空間可以進(jìn)一步擴(kuò)展,生成二級(jí)命名空間:
復(fù)制代碼 代碼如下:
<script type="text/javascript">
var GLOBAL={}
</script>
<script type="text/javascript">
(function(){
var a=123, a1=256;
GLOBAL.A={};
GLOBAL.A.CAT={};
GLOBAL.A.DOG={};
GLOBAL.A.CAT.name="mini";
GLOBAL.A.CAT.move=function(){
}
GLOBAL.A.DOG.name="mini";
GLOBAL.A.DOG.move=function(){
}
})();
</script>
因生成命名空間是非常常用的功能,可以進(jìn)一步將生成命名空間的功能定義成一個(gè)函數(shù),方便調(diào)用,如下:
復(fù)制代碼 代碼如下:
<script type="text/javascript">
var GLOBAL={}
GLOBAL.namespace=function(str){
var arr=str.split("."), o=GLOBAL;
for(i=arr[0]=="GLOBAL"?1:0;i<arr.length; i++){
o[arr[i]]=o[arr[i]] || {};
o=o[arr[i]];
}
}
</script>
調(diào)用命名空間具體操作:
復(fù)制代碼 代碼如下:
<script type="text/javascript">
//=============================================================
// 功能A
// 工程師甲
// email:ctkl68945@gmail.com msn:ctkl68945@hotmail.com"
// 2012-11-06
//=============================================================
(function(){
var a=123, a1="hello world";
GLOBAL.namespace("A.CAT");
GLOBAL.namespace("A.DOG");
GLOBAL.A.CAT.name="mini";
GLOBAL.A.CAT.move=function(){
}
GLOBAL.A.DOG.name="mini";
GLOBAL.A.DOG.move=function(){
}
GLOBAL.A.str=a;
GLOBAL.A.str1=a1;
})();
依次類似,無(wú)論多人的直接團(tuán)隊(duì)開發(fā),還是個(gè)人的間接團(tuán)隊(duì)合作,都需要良好的可維護(hù)性。
1、添加必要的代碼注釋
2、讓JS不產(chǎn)生沖突,需避免全局變量的泛濫,合理使用命名空間
相關(guān)文章
- 記錄一下這些內(nèi)容只是以后查閱起來(lái)方便,作為自己知識(shí)積累的記錄。其中有很多是參考網(wǎng)絡(luò)上的資源,不再一一寫出出處,還請(qǐng)?jiān)髡咭娬彙?/div> 2010-12-12
ionic 3.0+ 項(xiàng)目搭建運(yùn)行環(huán)境的教程
本篇文章主要介紹了ionic 3.0+ 項(xiàng)目搭建運(yùn)行的教程,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-08-08JS使用鏈?zhǔn)綄傩员磉_(dá)式取值和賦值的實(shí)現(xiàn)方法
這篇文章主要給大家詳細(xì)介紹了JS如何使用鏈?zhǔn)綄傩员磉_(dá)式取值和賦值,文章通過(guò)代碼示例介紹的非常詳細(xì),對(duì)我們的學(xué)習(xí)或工作有一定的幫助,感興趣的同學(xué)可以參考一下2023-08-08jsonp格式前端發(fā)送和后臺(tái)接受寫法的代碼詳解
jsonp是ajax提交的一種格式不會(huì)受跨域限制,這篇文章主要介紹了jsonp格式前端發(fā)送和后臺(tái)接受寫法的代碼詳解,需要的朋友可以參考下2019-11-11用javascript getComputedStyle獲取和設(shè)置style的原理
這兩天用了baidu 百度空間中的彈出窗口js,感覺不錯(cuò),很強(qiáng)大,很好很簡(jiǎn)單的解決了好幾個(gè)問題,界面友好度以及美化也好多了,以前都是硬邦邦window.open();2008-10-10最新評(píng)論