我的模块加载系统 v11

我的模块加载系统也终于到11这样高的版本了，随着它的完成，其他模块也加快了进RC的发布表，文档撰写工作也在跟进中。在本文的最后，我会提供dom Framework的部分文档下载（CHM文件）。

本版本有以下改进:

强化dom.require，如果这个回调代表的是模块，则只允许执行一次，如果是这个回调是用户指定的正向回调，则可以执行无数次。
强化对window的判定，相关讨论见这里与这里。
移除dom.ready方法，只提供dom(function(){})这种简捷形式。
更改dom.uuid为dom["@uuid"],dom.basePath为dom["@path"]，以示它们是系统变量。现在核心模块拥有的系统变量有： @uuid, @name, @debug, @emitte, @path, @modules，请不要对它们进行读写操作。
更改是否在顶层窗口的判定 global.frameElement == null --> self.eval === top.eval
简化fixOperaError中伪dom命名空间对象，此对象唯一用于在iframe测试URL是否死链接，模拟script的onerror事件：
优化截取隐藏命名空间的正则，由： /(\W|(#.+))/g 改为 /(#.+|\W)/g，

通过测试的浏览器：IE6-9 FF3.6.12 FF5.1 opera11.50 safari 5 chrome14.0.8

小知识：正向回调与负向回调

在大部分浏览器的script节点中，有两个事件，一个是onload,一个是onerror。如果加载成功就执行onload的回调，也就是所谓的正向回调，相反，加载失败，就会执行onerror的回调，也就是所谓的负向回调。opera与IE678没有onerror,IE678也没有onload。dom Framework通过各种手段解决此问题，实现按需加载，并行加载，自动处理依赖（让模块按正确的顺序执行），自动报错。。。

//=========================================
// 模块加载模块（核心模块）2011.10.9 by 司徒正美
//=========================================
(function(global,DOC){
    var
    _dom = global.dom,
    w3c = DOC.dispatchEvent, //w3c事件模型
    namespace = DOC.URL.replace(/(#.+|\\W)/g,''),
    rreadystate = /loaded|complete|undefine/i,
    HEAD = DOC.head || DOC.getElementsByTagName("head")[0],
    class2type = {
        "[object HTMLDocument]"   : "Document",
        "[object HTMLCollection]" : "NodeList",
        "[object StaticNodeList]" : "NodeList",
        "[object IXMLDOMNodeList]": "NodeList",
        "[object DOMWindow]"      : "Window"  ,
        "[object global]"         : "Window"  ,
        "null"                    : "Null"    ,
        "NaN"                     : "NaN"     ,
        "undefined"               : "Undefined"
    },
    toString = class2type.toString;
    /**
     * 糅杂，为一个对象添加更多成员
     * @param {Object} target 目标对象
     * @param {Object} source 属性包
     * @return  {Object} 目标对象
     */
    function mix(target, source){
        var args = [].slice.call(arguments),key,
        ride = typeof args[args.length - 1] == "boolean" ? args.pop() : true;
        for(var i = 1;source = args[i++];){
            for (key in source) {
                if (ride || !(key in target)) {
                    target[key] = source[key];
                }
            }
        }
        return target;
    }
    /**
     * @class dom
     * dom Framework拥有两个命名空间,
     * 第一个是DOC.URL.replace(/(\W|(#.+))/g,'')，根据页面的地址动态生成
     * 第二个是dom，我们可以使用别名机制重写它
     * @namespace dom
     */
    var dom = function(expr,context){
        if(dom.type(expr,"Function")){ //注意在safari下,typeof nodeList的类型为function,因此必须使用dom.type
            dom.require("ready,node,event,fx",expr);
        }else{
            if(!dom.fn)
                throw "must load the 'node' module!"
            return new dom.fn.init(expr,context);
        }
    }
 
    mix(dom,{
        html:DOC.documentElement,
        head:HEAD,
        rword:/[^, ]+/g,
        "@uuid":1,
        "@name":"dom",
        "@debug":true,
        "@emitter": w3c ? "addEventListener" : "attachEvent",
        "@path":(function(url, scripts, node){
            scripts = DOC.getElementsByTagName("script");
            node = scripts[scripts.length - 1];
            url = node.hasAttribute ?  node.src : node.getAttribute('src', 4);
            return url.substr( 0, url.lastIndexOf('/'));
        })(),
        /**
         * 别名机制(相当于jquery的noConflict)
         * @param {String} name 新的命名空间
         */
        exports: function(name) {
            _dom && (global.dom = _dom);
            name = name || dom["@name"];
            dom["@name"] = name ;
            global[name] = global[namespace] = this;
        },
        /**
         * 数组化
         * @param {ArrayLike} nodes 要处理的类数组对象
         * @param {Number} start 可选。要抽取的片断的起始下标。如果是负数，从后面取起
         * @param {Number} end  可选。规定从何处结束选取
         * @return {Array}
         */
        slice: function (nodes, start, end) {
            for(var i = 0,n = nodes.length, result = []; i < n; i++){
                result[i] = nodes[i];
            }
            if (arguments.length > 1) {
                return result.slice(start , (end || result.length));
            } else {
                return result;
            }
        },
        noop:function(){} ,
        /**
         * 用于取得数据的类型或判定数据的类型
         * @param {Any} obj 要检测的东西
         * @param {String} str 要比较的类型
         * @return {String|Boolean}
         */
        type : function(obj, str){
            var result = class2type[ (obj == null || obj !== obj )? obj :  toString.call(obj)  ] || obj.nodeName || "#";
            if( result.charAt(0) === "#"){//兼容旧式浏览器与处理个别情况,如window.opera
                //利用IE678 window == document为true,document == window竟然为false的新奇特性
                if(obj == obj.document && obj.document != obj){
                    result = 'Window'; //返回构造器名字
                }else if(obj.nodeType === 9) {
                    result = 'Document';//返回构造器名字
                }else if(  obj.callee ){
                    result = 'Arguments';//返回构造器名字
                }else if(isFinite(obj.length) && obj.item ){
                    result = 'NodeList'; //处理节点集合
                }else if(obj.open && obj.send ){
                    result = "XMLHttpRequest";
                }else{
                    result = toString.call(obj).slice(8,-1);
                }
            }
            if(str){
                return str === result;
            }
            return result;
        },
        /**
         * 用于调试，如果是IE6直接打印到页面上
         * @param {String} s 要打印的内容
         * @param {Boolean} force 强逼打印到页面上
         */
        log:function(s, force){
            if(force || !global.console){
                var div =  DOC.body && DOC.createElement("div");
                if(div){
                    div.innerHTML = s;
                    DOC.body.appendChild(div)
                }
            }else{
                global.console.log(s);
            }
        },
        /**
         * 生成键值统一的对象，用于高速化判定
         * @param {Array|String} array 如果是字符串，请用","或空格分开
         * @param {Number} val 可选，默认为1
         * @return {Object}
         */
        oneObject : function(array, val){
            if(typeof array == "string"){
                array = array.match(dom.rword) || [];
            }
            var result = {},value = val !== void 0 ? val :1;
            for(var i=0,n=array.length;i < n;i++){
                result[array[i]] = value;
            }
            return result;
        }
    });
    "Boolean,Number,String,Function,Array,Date,RegExp,Window,Document,Arguments,NodeList,XMLHttpRequest".replace(dom.rword,function(name){
        class2type[ "[object " + name + "]" ] = name;
    });
    var
    rmodule =  /([^(\s]+)\(?([^)]*)\)?/,
    onload= w3c ? "onload" : "onreadystatechange",
    names = []//需要处理的模块名列表
    var map = dom["@modules"] = {
        "@ready" : { }
    };
 
    /**
     * 用于模拟opera的script onerror
     * @param {String} name 模块名
     * @param {String} url  模块的路径
     * @param {Element} node 为加载这个模块临时生成的script节点
     */
    function fixOperaError(name, url, node){
        var iframe = DOC.createElement("iframe");
        var code = "<script>this[document.URL.replace(/(#.+|\\W)/g,'')] = {define:Date } ; <\/script>"+
        '<script src="'+url+'" onload="this.document.x = 1;"><\/script>';//IE与opera的元素节点都拥有document属性，相当于ownerDocument
        iframe.style.display = "none";
        HEAD.appendChild(iframe);
        var d = iframe.contentDocument;
        d.write(code);
        d.close();
        iframe.onload = function(){
            if(d.x == void 0){
                removeScript(name, node, true);
            }
            iframe.onload = null;//opera无法在iframe被事件绑定时被移除
            HEAD.removeChild(this);
        };
    }
 
    /**
     * 为加载模块而临时生成一个script节点
     * @param {String} name 模块名
     * @param {String} url  模块的路径
     */
    function appendScript(name, url){
        var node = DOC.createElement("script");
        url = url  || dom["@path"] +"/"+ name.slice(1) + ".js" + (dom["@debug"] ? "?timestamp="+new Date : "");
        node.charset = "utf-8";
        node.async = true;
        node.onerror = function(){
            removeScript(name, this, true);
        }
        node[onload] = function(){
            if (w3c || rreadystate.test(this.readyState) ){
                resolveCallbacks();
                removeScript(name, this );
            }
        }
        node.src =  url;
        global.opera && fixOperaError(name, url, node);
        HEAD.insertBefore(node,HEAD.firstChild);
    }
    /**
     * 移除临时生成的script节点
     * @param {String} name 模块名
     * @param {Element} node 为加载这个模块临时生成的script节点
     * @param {Boolean} error 是否加载失败
     */
    function removeScript(name, node, error){
        var parent = node.parentNode;
        if(parent && parent.nodeType === 1){
            if(error || !map[name].state ){
                dom.stack(new Function('dom.log("fail to load module [ '+name+' ]")'));
                dom.stack.fire();//打印错误堆栈
            }
            node.clearAttributes &&  node.clearAttributes();
            node[onload] = node.onerror = null;
            parent.removeChild(node);
        }
    }
 
    //执行并移除所有依赖都具备的模块或回调
    function resolveCallbacks(){
        loop:
        for (var i = names.length,repeat, name; name = names[--i]; ) {
            var  obj = map[name], deps = obj.deps;
            for(var key in deps){
                if(deps.hasOwnProperty(key) && map[key].state != 2 ){
                    continue loop;
                }
            }
            //如果deps是空对象或者其依赖的模块的状态都是2
            if( obj.state != 2){
                names.splice(i,1);//必须先移除再执行，防止在IE下DOM树建完后手动刷新页面，会多次执行最后的回调函数
                obj.callback();
                obj.state = 2;
                repeat = true;
            }
        }
    repeat &&  resolveCallbacks();
    }
    function deferred(){//一个简单的异步列队
        var list = [],self = function(fn){
            fn && fn.call && list.push(fn);
            return self;
        }
        self.method = "shift";
        self.fire = function(fn){
            while(fn = list[self.method]()){
                fn();
            }
            return list.length ? self : self.complete();
        }
        self.complete = dom.noop;
        return self;
    }
    var errorstack = dom.stack = deferred();
    errorstack.method = "pop";
    mix(dom, {
        mix:mix,
        //绑定事件(简化版)
        bind : w3c ? function(el, type, fn, phase){
            el.addEventListener(type,fn, !!phase);
            return fn;
        } : function(el, type, fn){
            el.attachEvent("on"+type, fn);
            return fn;
        },
        unbind : w3c ? function(el, type, fn, phase){
            el.removeEventListener(type, fn, !!phase);
        } : function(el, type, fn){
            el.detachEvent("on"+type, fn);
        },
        /**
     * 请求模块
     * @param {String|Array} deps 依赖列表，如果是字符串请用逗号隔开，如果要指定具体路径请写到小括号中
     * @param {Function} module 正向回调
     * @param {Function} errback 负向回调
     */
        require:function(deps,callback,errback){
            var _deps = {}, dn = 0, cn = 0;
            (deps +"").replace(dom.rword,function(url,name,match){
                dn++;
                match = url.match(rmodule);
                name  = "@"+ match[1];//取得模块名
                if(!map[name]){ //防止重复生成节点与请求
                    map[name] = { };//state: undefined, 未加载; 1 已加载; 2 : 已执行
                    appendScript(name,match[2]);//加载JS文件
                }else if(map[name].state === 2){
                    cn++;
                }
                _deps[name] = "司徒正美";//有用的只是其键名,内容随便
            });
            if(dn === cn && !callback._name){
               callback();
            }
            var name = callback._name || "@cb"+ (+new Date + Math.random());
            dom.stack(errback);//压入错误堆栈
            map[name] = {//创建或更新模块的状态
                callback:callback,
                deps:_deps,
                state: 1
            };
            names.push(name);
        },
        /**
     * 定义模块
     * @param {String} name 模块名
     * @param {String} dependList 依赖列表
     * @param {Function} module 模块本身
     */
        define:function(name,deps,callback){
            if(typeof deps == "function"){//处理只有两个参数的情况
                callback = deps;
                deps = "";
            }
            callback._name =  "@"+name;  //模块名
            this.require(deps,callback);
        }
    });
    //domReady机制
    var readylist = deferred();
    function fireReady(){
        map["@ready"].state = 2;
        resolveCallbacks();//fix opera没有执行最后的回调
        readylist.complete = function(fn){
            fn && fn.call &&  fn()
        }
        readylist.fire();
        fireReady = dom.noop;
    };
    function doScrollCheck() {
        try {
            dom.html.doScroll("left");
            fireReady();
        } catch(e) {
            setTimeout( doScrollCheck, 1);
        }
    };
    //开始判定页面的加载情况
    if ( DOC.readyState === "complete" ) {
        fireReady();
    }else {
        dom.bind(DOC, (w3c ? "DOMContentLoaded" : "readystatechange"), function(){
            if (w3c || DOC.readyState === "complete") {
                fireReady();
            }
        });
        if ( dom.html.doScroll && self.eval === top.eval ) {
            doScrollCheck();
        }
    }
    //https://developer.mozilla.org/en/DOM/window.onpopstate
    dom.bind(global,"popstate",function(){
        namespace = DOC.URL.replace(/(#.+|\W)/g,'');
        dom.exports();
    });
    dom.exports();
})(this,this.document);
/**
 2011.7.11
@开头的为私有的系统变量，防止人们直接调用,
dom.check改为dom["@emitter"]
dom.namespace改为dom["@name"]
去掉无用的dom.modules
优化exports方法
2011.8.4
强化dom.log，让IE6也能打印日志
重构fixOperaError与resolveCallbacks
将provide方法合并到require中去
2011.8.7
重构define,require,resolve
添加"@modules"属性到dom命名空间上
增强domReady传参的判定
2011.8.18 应对HTML5 History API带来的“改变URL不刷新页面”技术，让URL改变时让namespace也跟着改变！
2011.8.20 去掉dom.K,添加更简单dom.noop，用一个简单的异步列队重写dom.ready与错误堆栈dom.stack
2011.9.5  强化dom.type
2011.9.19 强化dom.mix
2011.9.24 简化dom.bind 添加dom.unbind
2011.9.28 dom.bind 添加返回值
2011.9.30 更改是否在顶层窗口的判定  global.frameElement == null --> self.eval === top.eval
2011.10.1
更改dom.uuid为dom["@uuid"],dom.basePath为dom["@path"]，以示它们是系统变量
修复dom.require BUG 如果所有依赖模块之前都加载执行过，则直接执行回调函数
移除dom.ready 只提供dom(function(){})这种简捷形式
2011.10.4 强化对IE window的判定, 修复dom.require BUG dn === cn --> dn === cn && !callback._name
2011.10.9 
简化fixOperaError中伪dom命名空间对象
优化截取隐藏命名空间的正则， /(\W|(#.+))/g --〉  /(#.+|\\W)/g
 
*/