浅谈js命名空间管理

在C# 和 Java里面我们如果想使用哪一个功能类就要引用相应的命名空间。

如C#里面有个System.Web.UI库，我们就要用using System.Web.UI;,之后我们就可以用到ScriptManager这个类了。

js里面其实是不纯在所谓的命名空间的，只是以对象字面量的方式展示出这种效果。

js实现以上的效果通过以下代码：

var System={

Web:{

UI:{

ScriptManager:{}

}

}

};

这种方式感觉比较麻烦，还是习惯通过System.Web.UI这种方式来注册一个命名空间 NameSpace.Register("System.Web.UI")，我们只需要动态的创建对象就能实现。

动态创建对象我们可以通过 两种方法：1.window 对象实现 2.eval实现。

下面就介绍两种实现方式：

1.window 对象实现 ：

我们知道定义一个对象可以这样，window['System']={}; System['Web']={} ;System.Web['UI']={};

其实这样就简单了，我们实现动态创建对象只需要拆分字符串创建对应的对象，代码如下：

var NameSpace = {
Register: function () {
// body...
var arg = arguments[0];
var arr = arg.split('.');
var context = window;
for (var i = 0; i < arr.length; i++) {
var str = arr[i];
if (!context[str]) {
context[str] = {};
}
context = context[str];
};
}
}

2.eval实现：

var NameSpace = {
Register: function () {
// body...
var arg = arguments[0];
var arr = arg.split('.');
var str = '';
for (var i = 0; i < arr.length; i++) {
str = i == 0 ? arr[i] : (str + '.' + arr[i]);
var sval = "   if(typeof " + str + "=='undefined' ) { " + str + "= new Object(); } ";
eval(sval) ;
};
}
}

这种是通过动态执行js字符串的方式，其实是将字符转换成代后执行而已，代码就没啥难度了。

我们就可以直接通过 NameSpace.Register("System.Web.UI")注册对象，然后 System.Web.UI.dom={ method:function(){}}这样扩展一些方法。

扩展想法：既然对象已经创建出来了，我又有了个想法。我觉得可以模仿模块化编程，进行进一步改造。可以扩展类似于以下的函数：

define("dom.utility", function(){

return {

test ：function(){

}

}

})

或者

define("dom.utility",{ test ：function(){

})

调用的时候我们就直接用dom.utility.test()这种方式;

实现这个define函数的思路：对象的属性拷贝，例如：将test属性加到dom.utility对象下面。

大家可以自己先写一个试试看，可以把代码贴到评论里面方便大家交流学习，下一篇我会贴出源码。