模块化开发之CMD规范

2019-02-01 本文已影响0人这里王工头

欢迎访问我的博客https://qqqww.com/，祝码农同胞们早日走上人生巅峰，迎娶白富美~~~

1 概念

CMD(Common Module Definition)，通用模块定义，它解决的问题和AMD规范是一样的，只不过在模块定义方式和模块加载时机上不同，CMD也需要额外的引入第三方的库文件，SeaJS

2 SeaJS

SeaJS推崇一个模块一个文件

2.1 定义模块

define 是一个全局函数，用来定义模块

语法：

define define(id?, deps?, factory)

参数：

id：可选，字符串类型，模块标识，如果没有提供参数，默认为文件名
dependencies：可选，字符串数组，当前模块依赖的模块，CMD 推崇依赖就近
factory：回调函数，工厂方法，初始化模块需要执行的函数或对象，如果为函数，它只被执行一次，如果是对象，此对象会作为模块的输出值

// cmd1.js
define(function(require,exports,module){
    // ...
    module.exports={
        // ..
    }
})

// cmd2.js
define(function(require,exports,module){    
    var cmd2 = require('./cmd1') 
    // cmd2.xxx 依赖就近书写
    module.exports={
        // ...
    }
})

除了给 exports 对象增加成员，还可以使用 return 直接向外提供接口

2.2 加载模块

SeaJS提供了seajs.use来加载模块

语法：

seajs.use([dependencies], function(){})

参数：

dependencies：字符串数组，该模块的依赖
function：Function类型，所依赖的模块都加载成功之后，回调，依赖的模块会以参数的形式传入该函数，从而在回调函数内部就可以使用这些模块

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <script src="sea.js"></script>
        <script src="cmd2.js"></script>
        <script src="cmd1.js"></script>
        <script type="text/javascript">
            seajs.use(['cmd2.js','cmd1.js'],function(cmd2,cmd1){
                // ....
            })
        </script>
    </body>
</html>

模块化开发之CMD规范

1 概念

2 SeaJS

2.1 定义模块

2.2 加载模块

3 文章推荐

4 参考文章

猜你喜欢

热点阅读