利用命名空间避免JavaScript全局变量冲突

JavaScript命名空间基础概念

为防止变量间的覆盖与冲突，可以创建命名空间。命名空间实质上是一种特殊的前缀，在JavaScript中，通常通过对象字面量{ }来实现这一机制。

在不同的匿名函数中，依据功能需求声明不同的命名空间。每个匿名函数中的GLOBAL对象属性不直接挂载在全局GLOBAL上，而是挂载在该匿名函数定义的命名空间下，例如：

 
<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>

构建二级命名空间

若同一匿名函数内的程序逻辑复杂且变量众多，命名空间可进一步扩展，生成二级命名空间：

 
<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>

封装通用命名空间函数

由于生成命名空间是常见需求，可将其封装为一个函数以便复用，具体实现如下：

 
<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>

命名空间调用示例与最佳实践

调用命名空间的具体操作示例：

 
<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;
})(); 

无论是多人直接团队协作，还是个人间接合作，良好的代码可维护性都至关重要。

1、添加必要的代码注释

2、让JS不产生冲突，需避免全局变量的泛滥，合理使用命名空间