我的框架别名机制

这个别名机制类似jQuery的noConflict。jQuery所占用的全局变量有两个:jQuery与$。你也可以说它们是其命名空间，整个框架就以树状式“单足独立”地建立于其上。但是由于我的东西是框架，换言之存在许多文件（如果你没有把它整合到一个文件的话），除了核心模块外，其他模块通过"require"方法动态加载到这个树状结构的命名空间上。可是，如果我把它的命名空间占用了，那些其他模块并不能非常智能地找到新的命名空间，因此我们需要一个永久性命名空间，如Ext的Ext。但这些简单的名字有很大机率被人占用的，因此，这名字应该足够长，足够复杂，非常没有意思，只能通过程序生成。因此我的框架搞了两个命名空间，一个是"dom"，另一个是 escape(document.URL.split("#")[0])。对于这样单页面的application，它的命名空间便可以随页面而改变了。"#"是防止使用锚点导致document.URL发生改变的。

下面就是一个小小的实验：

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta content="IE=8" http-equiv="X-UA-Compatible"/>
    <title>别名机制 by 司徒正美 </title>
    <style type="text/css">

      #box {
        200px;
        height:200px;
        border:1px solid black;
        position:absolute;
        left:20ex;
        top:100px;
        background-color:#EEE8AA;
      }
    </style>
    <link rel="kinetic-stylesheet" type="text/css" href="demo.kss" />

    <script type="text/javascript">
      var dom = {name:"别人的框架"};//一样使用dom做命名空间
      //================我的库=================
      (function(window,undefined){
        var dom = {
          name:"我的库"
        },
       	_dom = window.dom//把别人的框架保存到一个临时变量中
        //永久性命名空间，如果这个名字被其他框架占用就没救了
        //永久性命名空间是用于模块加载时，让新模块找到当前类框架的
        var namespace = escape(document.URL.split("#")[0]);
        dom.alias = function(newName) {
          //如果不指定新名，则随机生成一个，换言之，则进入忍者模式，需要用一个变量来接受它
          newName = newName || "dom"+Math.random();
          window.dom = _dom;
          return  window[namespace] = window[newName]  = dom;
        }
        window[namespace] = window.dom = dom;
      })(window);

      window.onload = function(){
        var a = dom.alias("$$");
        alert(a.name);
        alert(window.dom.name)//让与别人
        alert($$.name)//测试新的命名空间
        alert(window[escape(document.URL.split("#")[0])].name)//测试永久性命名空间
      }

    </script>
  </head>
  <body>

    <div id="box"></div>

  </body>
</html>

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta content="IE=8" http-equiv="X-UA-Compatible"/>
    <title>别名机制 by 司徒正美 </title>
    <style type="text/css">

#box {
        200px;
        height:200px;
        border:1px solid black;
        position:absolute;
        left:20ex;
        top:100px;
        background-color:#EEE8AA;
      }
    </style>
    <link rel="kinetic-stylesheet" type="text/css" href="demo.kss" />

window.onload = function(){
        var a = dom.alias("$$");
        alert(a.name);
        alert(window.dom.name)//让与别人
        alert($$.name)//测试新的命名空间
        alert(window[escape(document.URL.split("#")[0])].name)//测试永久性命名空间
      }

</script>
  </head>
  <body>

</body>
</html>

具体用法看我的文档(已放出)

我的框架 别名机制

我的框架别名机制