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)
    })
})

  

 
时间: 2024-11-23 08:19:05

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

m3m4加载器的优化版1.0,能满足基本需求了

/* //1.以$开头的模块名,表示服务,服务只会执行一次,它可以有自己的方法.比如cookie就是一个服务 //例如:console.log("root");只会执行一次 define("$root",[function(){ console.log("root"); return "root" }]) //2.非$开头的表示普通模块,普通模块每次调用的时候都会执行 //例如:console.log("userLi

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

先来说一下前端模块化的价值:引用模块此处有详细的介绍,可以自行前往观看. 一.总结如下优点: (1)解决命名冲突(2)烦琐的文件依赖(3)模块的版本管理(4)提高可维护性(5)前端性能优化(6)跨环境共享模块 二.加载器的基本思路: 如何去定义我们的模块? 如何将我们定义的模块去合并? 我们想一下,如果我们正常的引用入js到页面我们需要做神马事情,是否是使用:<script type="text/javascript" src="xxx"></sc

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

摘自http://blog.csdn.net/zzxian/article/details/16820035 C编译器.链接器.加载器详解 一.概述 C语言的编译链接过程要把我们编写的一个c程序(源代码)转换成可以在硬件上运行的程序(可执行代码),需要进行编译和链接.编译就是把文本形式源代码翻译为机器语言形式的目标文件的过程.链接是把目标文件.操作系统的启动代码和用到的库文件进行组织形成最终生成可加载.可执行代码的过程. 过程图解如下: 预处理器:将.c 文件转化成 .i文件,使用的gcc命令是

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

此篇已收录至<你必须知道的.Net>读书笔记目录贴,点击访问该目录可以获取更多内容. 一.关于万能加载器 简而言之,就是孝顺的小王想开发一个万能程序,可以一键式打开常见的计算机资料,例如:文档.图片和影音文件等,只需要安装一个程序就可以免去其他应用文件的管理(你让其他耗费了巨资打造的软件情何以堪...),于是就有了这个万能加载器(FileLoader). 初步分析之后,小王总结了这个万能加载器的功能点如下: (1)能够打开常见文档类资料:txt.word.pdf.visio等: (2)能够打开

图片加载器

图片加载器: 1 最重要的为ImageLoader类 : /** * 保证了图片压缩,缓存和正常加载 * @author micro * */ public class ImageLoader { /** * 图片缓存空间 */ private LruCache<String, Bitmap> mLruCache; //线程池 private ExecutorService mThreadPools; private static final int DEFAULT_THREAD_COUNT

如何构建一个微型的CMD模块化加载器

前言 前端模块化是一个老生常谈的话题,模块化的好处是不言而喻,比如易于代码复用.易于维护.易于团队开发d等云云.对于前端模块加载器,以前仅仅止步于会用的阶段,为了加深对前端模块化的理解,大概花了一周的时间来学习.调研并尝试自己实现一个简易版的符合CMD规范的加载器. 设计 加载器是按照CMD规范进行设计的,具体的CMD规范就不列出了,详情请见CMD规范. 入口函数 use(ids, callback) 模块定义函数 define(factory) 模块加载函数 require(id) 取得模块接

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

之前对这几个概念一直记得很模糊,也无法用自己的语言表达出来,今天看了大神的文章,尝试根据自己的理解总结一下,算是一篇读后感. 大神的文章:http://www.css88.com/archives/7628(大神的文章写的很详细,建议先看完大神的文章) 一.js模块化 什么是js模块化,我们从历史说起. 1.一开始我们怎么写脚本?就是在html文件中用<script></script>写代码 这种方式的缺点:代码复用靠复制,基本是全局变量. 2.后来我们用js文件写代码,用<

[源码]Python免杀ShellCode加载器(Cobaltstrike/Metasploit)

0x001 原理 采用分离法,即将ShellCode和加载器分离.方法较LOW但免杀. 本文主要将ShellCode转成HEX,再通过加载器执行ShellCode. PS: 何为SC加载器,即专门用于加载所提供ShellCode的工具. 如同HTTP发包工具,支持提交HTTP,写死参数最多只能叫EXP. 再详细点,打个比方,你只会炒一个菜,你敢说你是厨师吗? 0x002 ShellCode免杀 CS可生成很多种格式的ShellCode,具体该用哪一种呢? 由于部分杀软会查杀ShellCode文件

实现简单的 JS 模块加载器

实现简单的 JS 模块加载器 按需加载是前端性能优化的一个重要手段,按需加载的本质是从远程服务器加载一段JS代码(这里主要讨论JS,CSS或者其他资源大同小异),该JS代码就是一个模块的定义,如果您之前有去思考过按需加载的原理,那你可能已经知道按需加载需要依赖一个模块加载器.它可以加载所有的静态资源文件,比如: JS 脚本 CSS? 脚本 图片 资源 如果你了解 webpack,那您可以发现在 webpack 内部,它实现了一个模块加载器.模块加载器本身需要遵循一个规范,当然您可以自定义规范,大