理运用命名空间让js不产生冲突避免全局变量的泛滥


Posted in Javascript onJune 15, 2014

为了避免变量之间的覆盖与冲突,可以生成命名空间,命名空间是一种特殊的前缀,在js中,通过{ }对象实现。

在不同的匿名函数中,根据功能声明一个不同的命名空间,每个匿名函数中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不产生冲突,需避免全局变量的泛滥,合理使用命名空间

Javascript 相关文章推荐
jquery checkbox 勾选的bug问题解决方案与分析
Nov 13 Javascript
js实现文字在按钮上滚动的方法
Aug 20 Javascript
jQuery使用正则表达式限制文本框只能输入数字
Jun 18 Javascript
js创建数组的简单方法
Jul 27 Javascript
Javascript for in的缺陷总结
Feb 03 Javascript
bootstrap模态框远程示例代码分享
May 22 Javascript
ES6/JavaScript使用技巧分享
Dec 14 Javascript
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 jQuery
JavaScript生成一个不重复的ID的方法示例
Sep 16 Javascript
Vue父组件向子组件传值以及data和props的区别详解
Mar 02 Javascript
Vue proxyTable配置多个接口地址,解决跨域的问题
Sep 11 Javascript
ant-design-vue 时间选择器赋值默认时间的操作
Oct 27 Javascript
jQuery获取动态生成的元素示例
Jun 15 #Javascript
jquery 实现input输入什么div图层显示什么
Jun 15 #Javascript
jQuery实现table隔行换色和鼠标经过变色的两种方法
Jun 15 #Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
Jun 15 #Javascript
Javascript实现简单二级下拉菜单实例
Jun 15 #Javascript
jQuery $.extend()用法总结
Jun 15 #Javascript
解决自定义$(id)的方法与jquery选择器$冲突的问题
Jun 14 #Javascript
You might like
ThinkPHP框架里隐藏index.php
2016/04/12 PHP
简单谈谈 php 文件锁
2017/02/19 PHP
轻轻松松学JS调试(不下载任何工具)
2010/04/14 Javascript
JQuery扩展插件Validate 1 基本使用方法并打包下载
2011/09/05 Javascript
jquery tab插件精简版分享
2011/09/10 Javascript
Yii-自定义删除确认弹框(zyd)jquery实现代码
2013/03/04 Javascript
用jQuery与JSONP轻松解决跨域访问的问题
2014/02/04 Javascript
table行随鼠标移动变色示例
2014/05/07 Javascript
Node.js实现批量去除BOM文件头
2014/12/20 Javascript
jQuery简单注册和禁用全局事件的方法
2016/07/25 Javascript
在JavaScript中调用Java类和接口的方法
2016/09/07 Javascript
vue实现简单实时汇率计算功能
2017/01/15 Javascript
JavaScript队列函数和异步执行详解
2017/06/19 Javascript
javascript cookie的基本操作(添加和删除)
2017/07/24 Javascript
JavaScript实现动态添加Form表单元素的方法示例
2017/08/14 Javascript
详解vue-cli脚手架中webpack配置方法
2018/08/22 Javascript
详解如何用VUE写一个多用模态框组件模版
2018/09/27 Javascript
在element-ui的el-tree组件中用render函数生成el-button的实例代码
2018/11/05 Javascript
vue-cli 3.0 版本与3.0以下版本在搭建项目时的区别详解
2018/12/11 Javascript
python多线程threading.Lock锁用法实例
2014/11/01 Python
python下如何查询CS反恐精英的服务器信息
2017/01/17 Python
Python内置模块hashlib、hmac与uuid用法分析
2018/02/12 Python
pyqt5 实现工具栏文字图片同时显示
2019/06/13 Python
python中的 zip函数详解及用法举例
2020/02/16 Python
基于Python实现简单学生管理系统
2020/07/24 Python
Python 带星号(* 或 **)的函数参数详解
2021/02/23 Python
纯CSS3实现给头像加个光芒四射且旋转的背景动画效果
2014/05/07 HTML / CSS
Ootori在线按摩椅店:一家专业的按摩椅制造商
2019/04/10 全球购物
C++:局部变量能否和全局变量重名
2014/03/03 面试题
《山谷中的谜底》教学反思
2014/04/26 职场文书
优秀语文教师事迹
2014/05/18 职场文书
爱心捐款活动总结
2015/05/09 职场文书
毕业论文致谢部分怎么写
2015/05/14 职场文书
个人收入证明范本
2015/06/12 职场文书
Golang生成Excel文档的方法步骤
2021/06/09 Golang
Windows Server 2016 配置 IIS 的详细步骤
2022/04/28 Servers