同步模块模式

同步模块模式版本一(代码来自《javascript设计模式》–百度工程师)

以前一直对模块开发只是听说过,但没有实际用过,去年的时候使用reactNative和前段时间自己折腾AngularJs,在这些框架中全是基于模块开发的,然后我对比了一下以前写js的方式(以前的方式太low了)。周围一些人一直在使用AngularJs开发东西,他们说到什么依赖注入这些东西(以前学高级java的时候对依赖注入比较了解),js 是没有类反射的,AngularJS所谓的依赖注入也只是通过名称拿到对象的引用,这也是所谓的模块开发基础。而我对模块开发实现原理比较深入的了解是在前不久无意看了《javascript设计模式》。
//模块管理器单体对象

//定义模块管理器单体对象
    var F = F || {};

    /***
    *@param str 模块路由
    *@param fn 模块方法
    **/

    F.define = function(str , fn){
        //解析路由
        var parts = str.split(".");
            //当前模块的祖父模块,parent当前模块父模块
            old = parent = this;
            //i 模块层级,len 模块层级长度
            i = len = 0;
        if(parts.length > 0){

            //如果第一个模块是模块管理器单体对象,则移除
            if(parts[0] === "F"){
                parts = parts.slice(1);
            }

            //屏蔽对define与module模块方法的重写
            if(parts[0] === "define" || parts[0] === "module"){
                return ;
            }

            //遍历路由模块并定义每层模块
            for(var i  = 0 ; i < parts.length ; i++){
                if(typeof parent[parts[i]] === "undefined"){
                    parent[parts[i]] = {};
                }
                old = parent;
                parent = parent[parts[i]];
            }

            //如果给定模块方法则定义该模块方法
            if(fn){
                old[parts[--i]] = fn(); 
            }
            return this;
        }
    };

    F.define("say.hello",function(){
        return function(str){
            console.log(str);
        }
    });


    //模块调用方法
    F.module = function(){
        //将参数转化为数组
        var args = [].slice.call(arguments);
            //获取执行函数
            fn = args.pop();
            //获取模块依赖,如果args[0] 是数组,则依赖模块为args[0],否则依赖模块为args
            parts = args[0] && args[0] instanceof Array ? args[0]:args;
            //依赖模块列表
            modules = [];
            //模块路由
            modIDs = '';
            i = 0 ;
            //依赖模块长度
            ilen = parts.length;
        while(i < ilen){
            //解析模块路由,并屏蔽模块父对象
            modIDs = parts[i].replace(/^F\./,'').split(".");
            parent = this;
            for(var j = 0 ; j < modIDs.length ; j++){
                parent = parent[modIDs[j]] || false;
            }
            //将模块添加到依赖模块列表中
            modules.push(parent);
            i++;
        }
        //构造函数执行环境
        fn.apply(null,modules);
    }

    F.module(['say.hello'],function(say){
        say("say Hello");
    });
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值