m3m4加载器的优化版m3m4-v1.1

  

/*
 //1、以$开头的模块名,表示服务,服务只会执行一次,它可以有自己的方法。比如cookie就是一个服务
 //例如:console.log("root");只会执行一次
 define("$root",[function(){
 console.log("root");
 return "root"
 }])
 //2、非$开头的表示普通模块,普通模块每次调用的时候都会执行
 //例如:console.log("userList");每次都会执行
 define("userList",["$root",function($root){
 console.log($root);
 console.log("userList");
 return "userList"
 }])
 //3、存在 $callback 表示异步回调模块,$callback将返回异步的数据
 define("sync1",["$root","$callback",function(a,callback){
 console.log(22)
 setTimeout(function(){
 callback("1 sync")
 },1000)
 }])
 require("sync1",function(sync1){
 console.log(sync1);//将输出结果:1 sync
 })
 * */
(function($){
    var baseModels={}
    var baseLoaded={}
    var baseCache={}

    function define(name,args,base){
        if(base){
            baseLoaded[name]=true
            baseCache[name]=args
        }else{
            baseModels[name]=args
        }
    }
    function require(name,callback){

        var models=Object.create(baseModels)
        var curCache=Object.create(baseCache)
        var curLoaded=Object.create(baseLoaded)
        var self={
            version:"m3m4-v1.1"
        }
        function curRequire(name,callback){
            //从全局中返回
            if(/^\$/.test(name)&&baseLoaded[name]){
                callback(baseCache[name])
                return
            }
            //返回结果
            if(curLoaded[name]){
                callback(curCache[name])
                //设置全局
                if(/^\$/.test(name)){
                    baseCache[name]=curCache[name]
                    baseLoaded[name]=curLoaded[name]
                }
                return
            }
            var next=function(){
                curRequire(name,callback)
            }
            //获取模块长度

            var args=models[name]
            var func=args[args.length-1]
            var len=args.length-1
            var dataArr=[]
            //过滤 $callback
            var sync=args.indexOf("$callback")
            if(sync!=-1){
                dataArr[sync]=function(back){
                    curCache[name]=back
                    curLoaded[name]=true
                    next()
                }
               if(--len==0){
                   func.apply(self,dataArr)
                   return;
               }
            }
            if(len==0){
                curCache[name]=func.apply(self,dataArr)
                curLoaded[name]=true
                next()
            }else{
                for(var i=0;i<args.length-1;i++){
                    if(i==sync)continue;
                    (function(n,model){
                        curRequire(model,function(data){
                            dataArr[n]=data
                            if(--len==0){
                                if(sync!=-1){
                                    func.apply(self,dataArr)
                                }else{
                                    curCache[name]=func.apply(self,dataArr)
                                    curLoaded[name]=true
                                    next()
                                }
                            }
                        })

                    })(i,args[i])
                }
            }
        }
        //Api兼容写法
        if(Object.prototype.toString.call(name)!="[object Array]"){
            models["app"]=Array.prototype.slice.call(arguments)
        }else{
            models["app"]=name
        }
        curRequire("app",function(){})

    }
    $.m3m4=function(func){
        func(define,require)
    };
    $.define=define;
    $.require=require;
})(typeof window!="undefined"?window:global)

  

 demo

m3m4(function(define,require){
    //定义模块
    define("user1",["req",function(req){
        return req
    }])

    //路由1
    define("req",["$callback",function($callback){
        setTimeout(function(){
            $callback({
                url:"user1.html"
            })
        },1000)
    }])
    //执行
    require("user1",function(user1){
        console.log(user1)
    })
    //路由2
    define("req",["$callback",function($callback){
        setTimeout(function(){
            $callback({
                url:"user2.html"
            })
        },100)
    }])
    //执行
    require("user1",function(user1){
        console.log(user1)
    })
})

  

 

m3m4加载器的优化版m3m4-v1.1的更多相关文章

  1. js前端模块化之加载器原理解析(一)

    先来说一下前端模块化的价值:引用模块此处有详细的介绍,可以自行前往观看. 一.总结如下优点: (1)解决命名冲突(2)烦琐的文件依赖(3)模块的版本管理(4)提高可维护性(5)前端性能优化(6)跨环境 ...

  2. 构建服务端的AMD/CMD模块加载器

    本文原文地址:http://trock.lofter.com/post/117023_1208040 . 引言:  在前端开发领域,相信大家对AMD/CMD规范一定不会陌生,尤其对requireJS. ...

  3. C编译器、链接器、加载器详解

    摘自http://blog.csdn.net/zzxian/article/details/16820035 C编译器.链接器.加载器详解 一.概述 C语言的编译链接过程要把我们编写的一个c程序(源代 ...

  4. js模块化/js模块加载器/js模块打包器

    之前对这几个概念一直记得很模糊,也无法用自己的语言表达出来,今天看了大神的文章,尝试根据自己的理解总结一下,算是一篇读后感. 大神的文章:http://www.css88.com/archives/7 ...

  5. 《你必须知道的.NET》读书实践:一个基于OO的万能加载器的实现

    此篇已收录至<你必须知道的.Net>读书笔记目录贴,点击访问该目录可以获取更多内容. 一.关于万能加载器 简而言之,就是孝顺的小王想开发一个万能程序,可以一键式打开常见的计算机资料,例如: ...

  6. 小矮人Javascript模块加载器

    https://github.com/miniflycn/webkit-dwarf 短小精悍的webkit浏览器Javascript模块加载器 Why 我们有许多仅基于webkit浏览器开发的应用 无 ...

  7. RequireJS 是一个JavaScript模块加载器

    RequireJS 是一个JavaScript模块加载器.它非常适合在浏览器中使用, 它非常适合在浏览器中使用,但它也可以用在其他脚本环境, 就像 Rhino and Node. 使用RequireJ ...

  8. JS框架设计之加载器所在路径的探知一模块加载系统

    1.要加载一个模块,我们需要一个URL作为加载地址,一个script作为加载媒介,但用户在require是都用ID,我们需要一个将ID转换为URL的方法,思路很简单,强加个约定,URL的合成规则是为: ...

  9. How Tomcat Works 读书笔记 八 加载器 上

    Java的类加载器 具体资料见 http://blog.csdn.net/dlf123321/article/details/39957175 http://blog.csdn.net/dlf1233 ...

随机推荐

  1. Apache htcacheclean命令

    一.简介 htcacheclean可以用于将mod_disk_cache的磁盘缓冲区占用的空间保持在一个合理的水平.这个工具可以手动运行也可以作为后台守护进程运行.当作为守护进程运行的时候,它将每隔一 ...

  2. Entity Framework 6.0 Tutorials(11):Download Sample Project

    Download Sample Project: Download a sample project for Entity Framework 6 Database-First model below ...

  3. 【Andoid学习】GridView学习

    简介 一个在平面上可显示多个条目的可滚动的视图组件,该组件中的条目通过一个ListAdapter和该组件进行关联.比如实现九宫格图,用GridView是首选,也是最简单的. 属性:android:co ...

  4. 浅谈短视频APP的发展趋势

    2014年6月20日,在AppAnnie最新发布5月应用指数中,美拍荣登“非游戏类iOS榜单”全球下载量第一位置,成为全球iOS应用商店最热门APP.能在<AppAnnie应用指数>这份A ...

  5. 【模板】二维凸包 / [USACO5.1]圈奶牛Fencing the Cows

    Problem surface 戳我 Meaning 坐标系内有若干个点,问把这些点都圈起来的最小凸包周长. 这道题就是一道凸包的模板题啊,只要求出凸包后在计算就好了,给出几个注意点 记得检查是否有吧 ...

  6. 「BZOJ 2809」「APIO 2012」Dispatching「启发式合并」

    题意 给定一个\(1\)为根的树,每个点有\(c,w\)两个属性,你需要从某个点\(u\)子树里选择\(k\)个点,满足选出来的点\(\sum_{i=1}^k w(i)\leq m\),最大化\(k\ ...

  7. WCF进阶(二)——Contract

    前言 我和用户有个约定,这个契约上篇已经说过了,分为服务契约.操作契约.消息契约.数据契约等,说白了,你到底让我看到什么,你告诉我,或者说,我可以让你看到什么,你敢用吗?下面就说一些基础的,关于这个些 ...

  8. c++多线程基础2(命名空间 this_thread)

    整理自:zh.cppreference.com/w/cpp/thread std::this_thread::yield: 定义于头文件 <thread> 函数原型:void yield( ...

  9. bzoj2564: 集合的面积(闵可夫斯基和 凸包)

    题面 传送门 题解 花了一个下午的时间调出了一个稍微能看的板子--没办法网上的板子和咱的不太兼容-- 首先有一个叫做闵可夫斯基和的东西,就是给你两个点集\(A,B\),要你求一个点集\(C=\{x+y ...

  10. JavaWeb应用中初始化Log4j的两种方式

    本文主要介绍了普通JavaWeb应用(基于Tomcat)中初始化Log4j的两种方式: 1.通过增加 InitServlet ,设置令其自启动来初始化 Log4j . 2.通过监听器 ServletC ...