seajs模块化开发初探

seajs官网:http://seajs.org/docs/

使用seajs模块化开发:

seaJS的主要目的是令JavaScript开发模块化并可以轻松愉悦进行加载,将前端工程师从繁重的JavaScript文件及对象依赖处理中解放出来,可以专注于代码本身的逻辑。SeaJS可以与jQuery这类框架完美集成。SeaJS 遵循MIT 协议,无论个人还是公司,都可以免费自由使用。

注:seajs的默认根目录:sea.js,就是以它为根目录

四步骤:

  1. 引入seajs库;
  2. 如何变为模块?
    -define(function(require,exports,module){…});
  3. 如何调用模块?
    -exports:对外接口,
    seajs.use(地址,回调函数):去调用模块;
  4. 如何依赖模块?-require

模块化用法:

//这是test1.js内容
define(function(require,exports,module){//参数不变
    //exports:对外接口
    //require:依赖的接口
    require('./test2.js');//相对地址
    //如果地址是一个模块的话,那么require的返回值就是模块中的exports
    // 即:require('./test2.js')=exports;

    function tab(){
        alert(require('./test2.js').a);
    }
    //将方法暴露出去
    exports.tab=tab;
});
//这是test2.js
define(function(require,exports,module){
    var a=10;
    exports.a=a;
});
//这是主文件调用
seajs.use('./js/test1.js',function(ex){
    //回调的参数,就是模块中的exports
    ex.tab();
    //此时再声明同名函数也不冲突,两个同名函数作用于不同空间
    function tab(){
        alert(456);
    }
    tab();
});

seajs多模块引用:

seajs.use(['./main.js','./main2.js'],function(ex,ex2){...});

ex,ex2分别对应相应的模块接口!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值