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

在不同的匿名函数中,根据功能声明一个不同的命名空间,每个匿名函数中GLOBAL对象的属性都不直接挂在GLOBAL上,而是挂在次匿名函数的命名空间下,如:

  1. <script type="text/javascript">
  2. var GLOBAL={}
  3. </script>
  4. <script type="text/javascript">
  5. (function(){
  6. var a=123, a1=256;
  7. GLOBAL.A={}
  8. GLOBAL.A.str=a;
  9. })();
  10. </script>
  11. <script type="text/javascript">
  12. (function(){
  13. var b1=123, b2=256;
  14. GLOBAL.B={}
  15. GLOBAL.B.str=a;
  16. })();
  17. </script>

如果同一个匿名函数中的程序非常复杂,变量名很多,命名空间可以进一步扩展,生成二级命名空间:

  1. <script type="text/javascript">
  2. var GLOBAL={}
  3. </script>
  4. <script type="text/javascript">
  5. (function(){
  6. var a=123, a1=256;
  7. GLOBAL.A={};
  8. GLOBAL.A.CAT={};
  9. GLOBAL.A.DOG={};
  10. GLOBAL.A.CAT.name="mini";
  11. GLOBAL.A.CAT.move=function(){
  12. }
  13. GLOBAL.A.DOG.name="mini";
  14. GLOBAL.A.DOG.move=function(){
  15. }
  16. })();
  17. </script>

因生成命名空间是非常常用的功能,可以进一步将生成命名空间的功能定义成一个函数,方便调用,如下:

  1. <script type="text/javascript">
  2. var GLOBAL={}
  3. GLOBAL.namespace=function(str){
  4. var arr=str.split("."), o=GLOBAL;
  5. for(i=arr[0]=="GLOBAL"?1:0;i<arr.length; i++){
  6. o[arr[i]]=o[arr[i]] || {};
  7. o=o[arr[i]];
  8. }
  9. }
  10. </script>

调用命名空间具体操作:

  1. <script type="text/javascript">
  2. //=============================================================
  3. //     功能A
  4. //     工程师甲
  5. //     email:ctkl68945@gmail.com     msn:ctkl68945@hotmail.com"
  6. //     2012-11-06
  7. //=============================================================
  8. (function(){
  9. var a=123, a1="hello world";
  10. GLOBAL.namespace("A.CAT");
  11. GLOBAL.namespace("A.DOG");
  12. GLOBAL.A.CAT.name="mini";
  13. GLOBAL.A.CAT.move=function(){
  14. }
  15. GLOBAL.A.DOG.name="mini";
  16. GLOBAL.A.DOG.move=function(){
  17. }
  18. GLOBAL.A.str=a;
  19. GLOBAL.A.str1=a1;
  20. })();

依次类似,无论多人的直接团队开发,还是个人的间接团队合作,都需要良好的可维护性。

1、添加必要的代码注释

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

如何让js不产生冲突,避免全局变量的泛滥,合理运用命名空间的更多相关文章

  1. 怎样让js不产生冲突,避免全局变量的泛滥,合理运用命名空间

    为了避免变量之间的覆盖与冲突.能够生成命名空间.命名空间是一种特殊的前缀,在js中,通过{ }对象实现. 在不同的匿名函数中,依据功能声明一个不同的命名空间,每一个匿名函数中GLOBAL对象的属性都不 ...

  2. js避免命名冲突

    [1]工程师甲编写功能A var a = 1; var b = 2; alert(a+b); [2]工程师乙添加新功能B var a = 2; var b = 1; alert(a-b); [3]上一 ...

  3. discuz教程:discuz模板js与jQuery冲突的解决方案

    今天在做discuz模板的时候,用到jquery的时候和原来主题js冲突.这个主要是Discuz X使用了$(id)作为dom节点的获取方法,而$符号刚好与jQuery的默认符号相冲突. 以下是基于之 ...

  4. JS中的作用域以及全局变量的问题

    一. JS中的作用域 1.全局变量:函数外声明的变量,称为全部变量 局部变量:函数内部使用var声明的变量,称为局部变量在JS中,只有函数作用域,没有块级作用域!!!也就是说,if/for等有{}的结 ...

  5. JavaScript中解决jQuery和Prototype.js同时引入冲突问题

    两个库同时都定义了一个叫$的函数,所以在同时使用的时候会发生冲突.jQuery( http://jquery.com/ https://jquery.org/ )中提供了一种返还$的使用权给其他js库 ...

  6. Js获取iframe子页面全局变量

    项目中通过iframe内嵌了一个子页面,子页面定义了一些全局变量,父页面需要获取子页面的全局变量,做了一些测试(我的环境IE10和Firefox32.0.3),得出如下结论: IE下: window. ...

  7. js文件命名冲突理解

    在一个index.html文件里先后导入a.js和b.js文件a.js文件里写上var s = 2;console.log(s);b.js文件里写上var s = 5;这时a.js和b.js用了相同的 ...

  8. ECSHOP中transport.js和jquery冲突的解决方法

    jQuery 和global.js 冲突 百度和google多次,根据网上的大多数建议和自己测试,解决办法如下:删除global.js 或者global.js 文件的10-13行屏蔽//Object. ...

  9. JS高级---把局部变量变成全局变量

    如何把局部变量变成全局变量? 把局部变量给window就可以了     函数的自调用---自调用函数 一次性的函数--声明的同时, 直接调用了 (function () { console.log(& ...

随机推荐

  1. 【WEB API项目实战干货系列】- 导航篇(十足干货分享)

    在今天移动互联网的时代,作为攻城师的我们,谁不想着只写一套API就可以让我们的Web, Android APP, IOS APP, iPad APP, Hybired APP, H5 Web共用共同的 ...

  2. 酷派大神F2系列使用QPST进行nv备份和恢复,解决无信号问题(附备份文件)

    测试机器: 大神F2联通版 8675_W00 系统COOLUI55     写贴原因: 自己无意间刷错了包,结果手机无信号,进入工程模式怎么设置都没有用.尝试过系统还原(备份过).刷新的ROM.线刷, ...

  3. paip.powerdesign cdm pdm文件 代码生成器 java web 页面 实现

    paip.powerdesign cdm pdm文件 代码生成器 java web 页面 实现 准备从pd cdm生成java web 页面...但是,ms无直接地生成软件.... 只好自己解析cdm ...

  4. js中关于动态添加事件,不能使用循环变量的问题

    在编写事件的时候,我们难免会遇到以下这种情况:<!DOCTYPE html><html lang="en"><head> <meta ch ...

  5. Leetcode 121 Best Time to Buy and Sell Stock 动态规划

    由于题意太长,请自己翻译,很容易懂的. 做法:从前向后遍历数组,记录当前出现过的最低价格,作为买入价格,并计算以当天价格出售的收益,作为可能的最大收益,整个遍历过程中,出现过的最大收益就是所求.动态规 ...

  6. C# winform的WebBrowser非常规编程(强烈推荐)

    本文章被今日头条推荐 1.在WebBrowser中实现抓取301和302协议 在WebBrowser中抓取301和302协议目前官方提供的组件远远不够,需要借助HttpMonitor.dll.这个组件 ...

  7. VS2015 C#6.0 中的那些新特性

    本人个人博客原文链接地址为http://aehyok.com/Blog/Detail/66.html. 个人网站地址:aehyok.com QQ 技术群号:206058845,验证码为:aehyok ...

  8. 使用RAML描述API文档信息的一些用法整理

    RAML是Restful API Modeling Language的缩写,是用来描述API信息的文档. 创建一个.raml后缀的文件,用Atom打开. 基本用法 #%RAML 0.8 title: ...

  9. Java多线程(3) Volatile的实现原理

    Volatile变量 在程序设计中,尤其是在C语言.C++.C#和Java语言中,使用volatile关键字声明的变量或对象通常拥有和优化和(或)多线程相关的特殊属性.通常,volatile关键字用来 ...

  10. 国内市场上 Android 手机屏幕分辨率的比例情况如何?

    http://www.zhihu.com/question/19587205 根据友盟发布的<友盟国内Android数据报告>,前六名分别是: 800×480,32.4% 480×320, ...