`
focus2008
  • 浏览: 27363 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

阿里淘宝的js命名空间函数namespace

阅读更多
在使用阿里开源的druid数据库连接池时,发现它的jar包中包含了三个资源包:
support.http.resources,support.
http.resources.css,
support.http.resources.js
打开看,有很多的html页面和他们的css和js文件,奇怪的是其中的jquery.min.js是被他们修改过了的,在其中增加了一个命名空间的函数:
/* 这里是经过压缩的jquery.min.js源码,省略*/

$.namespace = function() {
   var a=arguments, o=null, i, j, d;
   for (i=0; i<a.length; i=i+1) {
      d=a[i].split(".");
      o=window;
      for (j=0; j<d.length; j=j+1) {
         o[d[j]]=o[d[j]] || {};
         o=o[d[j]];
      }
   }
return o;
};

具体代码可以参考:https://github.com/alibaba/druid/blob/master/src/main/resources/support/http/resources/js/jquery.min.js
使用方法是:
<sctipt type="text/javascript">
$.namespace("druid.common.test");

druid.common.test = function () {  
	//......
	
	return  {
		init : function() {
			
		}      
        // ... ...
	}
}();

// 可以如下调用命名空间的函数:
druid.common.test.init();
</script>

这里的含义是在window上定义了一个命名空间druid.common.test,然后在该命名空间中定义一些要使用的方法,我们在页面上使用这些方法时,就可以这样调用:druid.common.test.init();
如果我们F12打开firebug调试,点击“脚本”选项,就会在右边看到其实质就是在window上定义了一个 druid 对象,然后又在改对象上定义一个common对象,最后再common对象上定义一个test对象,init函数就是test对象上的函数或者说方法。
$.namespace("druid.common.test");其实等价于下面的代码:
arguments = "druid.common.test";
var d = arguments[0].split(".");
window[d[0]] = window[d[0]]||{};
window[d[0]][d[1]] = window[d[0]][d[1]]||{};
window[d[0]][d[1]][d[2]] = window[d[0]][d[1]][d[2]]||{};


所以namespace函数的实质就是使用对象链条,来模拟命名空间

明白了原理,那么我们自己不使用$.namespace()函数也可以自己定义命名空间:
// 假设项目名称为jblog,然后这是index.jsp页面中的js,那么可以如下这样写:
window.jblog = window.jblog || {};
window.jblog.index = window.jblog.index || {};
jblog.index = function(){
   return {
      init : function(){
             // 这里是函数init的定义
             alert('init');
      }
   }
}();

// 这样使用它:
jblog.index.init();

这样就可以将一个页面中所有的函数以及变量都放入命名空间 jblog.index 下面,极大的降低了当要引入其他js库是存在名字冲突的可能性。

比如long.jsp页面中的js代码就可以将其放入命名空间 jblog.login 下面。
注意代码“window.jblog = window.jblog || {};”中后面的“ || {}”不能省略,这是为了防止将原有的命名空间覆盖掉!
分享到:
评论

相关推荐

    「Python系列」Python命名空间和作用域,命名空间(Namespace)和作用域(Scope)是两个非常重要的概念.md

    - **局部命名空间**:也被称为函数命名空间,是指在函数内部定义的所有变量和函数所在的命名空间。这些变量只能在该函数内部被访问,因此每个函数都可以有自己独立的局部命名空间,这对于防止变量之间的冲突非常有用...

    vs2010 导出创建dll 导入使用dll 导出有命名空间的类 函数 外部函数

    本篇文章将深入探讨如何在VS2010中创建DLL,导出带有命名空间的类和函数,以及如何在其他项目中导入并使用这些DLL。 首先,我们需要了解如何在VS2010中创建DLL项目。打开Visual Studio 2010,选择“文件”&gt;“新建”...

    JavaScript创建命名空间(namespace)的最简实现

    首先,命名空间的创建主要利用了JavaScript的动态特性,如变量声明和函数执行。其中,使用了`eval`方法,它允许将字符串作为JavaScript代码执行。`eval`是一个危险的函数,因为它的参数可以是任意的,一旦使用不当,...

    c++制作自己的namespace命名空间

    在C++编程语言中,`namespace` 是一个重要的组织代码的工具,它允许程序员将相关的函数、类和其他标识符分组到逻辑单元中,避免命名冲突。`namespace` 的概念在大型项目中尤为重要,因为随着代码量的增加,可能会...

    python命名空间(namespace)简单介绍

    在Python编程中,命名空间(namespace)是一个用于存放变量的虚拟存储区,它和作用域息息相关。本文将详细介绍Python中的命名空间概念,并通过示例代码来进行说明,以供读者参考学习。 首先,命名空间是变量存储的...

    javascript自执行函数之伪命名空间封装法.docx

    ### JavaScript自执行函数之伪命名空间封装法 #### 一、引言 在现代Web开发中,JavaScript作为一种广泛使用的客户端脚本语言,其作用日益显著。为了提高代码的可维护性和安全性,开发者们不断探索新的编码技巧。...

    PHP命名空间(Namespace)简明教程

    PHP命名空间(Namespace)是PHP5.3版本引入的一个新特性,它允许我们定义一个独立的区域来存放相关的类、函数和常量,以避免在全局空间中可能出现的命名冲突。命名空间在最初提出是在PHP6的计划中,但后来提前至...

    JS命名空间的一种改进版本

    本篇将深入探讨"JS命名空间的一种改进版本",并结合提供的"namescape-master"文件,介绍现代JavaScript中更高效、更灵活的命名空间实现策略。 一、理解传统命名空间 传统的JavaScript命名空间通常是通过创建一个...

    namespace.js Javascript的命名空间库

    namespace.js是一个为了在JavaScript中提供命名空间功能而设计的库,它允许开发者通过定义命名空间来组织和封装代码。 命名空间对象的定义通常包括了对象本身以及用于创建对象的方法。例如,namespace.js库中的`...

    PostGIS空间函数简介

    2、空间关系判断函数 常见的空间关系(Geometry Relationships)包括:Disjoint、Intersects、Touches、Crosses、Within、Contains、Overlaps、Relates。 3、空间操作函数 常见的空间操作(Geometry Operations)...

    javascript创建命名空间的5种写法_.docx

    - **定义命名空间**:通过构造函数`namespace.hello`来定义命名空间内的数据成员。 - **扩展方法**:利用`prototype`来添加方法。这样做可以避免每次创建新实例时都创建新的方法副本,节省内存资源。 - **实例化**:...

    C#与JAVASCRIPT函数的相互调用 C#调用JAVASCRIPT函数的调用 JAVASCRIPT调用C#函数的调用

    C#与JAVASCRIPT函数的相互调用 C#调用JAVASCRIPT函数的调用 JAVASCRIPT调用C#函数的调用

    浅谈几种常见语言的命名空间(Namespace)

    C++中的命名空间可以嵌套,命名空间可以看作一个容器,里面的元素如类、函数、变量等具有全局作用域,但是它们的名称被限定在命名空间内。一个命名空间中的名字可以覆盖掉另一个命名空间中的同名元素。例如,在C++...

    C++命名空间namespace的介绍与使用

    C++命名空间(namespace)是C++编程语言中一个重要的特性,它的主要目的是为了帮助解决在大型项目中可能出现的名称冲突问题。当多个模块或库使用相同的标识符时,命名空间提供了一种方法,使得相同名称的标识符可以...

    C++命名空间自定义及使用(附完整程序)

    在C++编程语言中,命名空间(namespace)是一种组织代码的重要工具,它允许程序员将相关的标识符(如变量、函数、类等)分组到一个逻辑范围内,避免了全局作用域中的命名冲突问题。本教程将深入探讨C++命名空间的...

    js关于命名空间的函数实例

    这种通过函数模拟命名空间的方法在JavaScript开发中非常常见,尤其是在大型项目或库的开发中,这种方式可以帮助开发者组织和封装代码,极大地提高代码的可读性和可维护性。需要注意的是,虽然使用命名空间可以减少...

    PHP命名空间namespace的定义方法详解

    在PHP中,命名空间(namespace)是一种封装事物的方法,用于避免类名、函数名和常量名之间的冲突。使用命名空间可以将代码逻辑上进行分组,便于维护和扩展。本篇内容将深入探讨PHP命名空间的定义方法,并通过实例进行...

    javascript指南和函数式编程

    5. **函数式数据结构**:如Immutable.js库提供的不可变数据结构,有助于减少副作用和提高代码可预测性。 6. **Monad**:虽然在JavaScript中应用较少,但了解其概念可以帮助理解复杂的函数式编程概念。 7. **...

    phpmailer+thinkphp3.2,命名空间

    总的来说,"phpmailer+thinkphp3.2,命名空间"这个话题涉及了如何在ThinkPHP 3.2框架中利用PHPMailer库进行邮件发送。通过控制器(如`DiaoyongController.class`)调用服务层或工具类中的方法,开发者可以实现与用户...

Global site tag (gtag.js) - Google Analytics