模块化开发之CMD规范

模块化开发之CMD规范

欢迎访问我的博客,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~

概念

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

SeaJS

SeaJS推崇一个模块一个文件

定义模块

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

语法

1
define define(id?, deps?, factory)

参数

  • id:可选,字符串类型,模块标识,如果没有提供参数,默认为文件名
  • dependencies:可选,字符串数组,当前模块依赖的模块,CMD 推崇依赖就近
  • factory:回调函数,工厂方法,初始化模块需要执行的函数或对象,如果为函数,它只被执行一次,如果是对象,此对象会作为模块的输出值
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 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 直接向外提供接口

加载模块

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

语法

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

参数

  • dependencies:字符串数组,该模块的依赖
  • function:Function类型,所依赖的模块都加载成功之后,回调,依赖的模块会以参数的形式传入该函数,从而在回调函数内部就可以使用这些模块
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!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规范

文章作者:王工头

发布时间:2019年01月31日 - 21:16:28

最后更新:2019年01月31日 - 23:38:15

原始链接:https://qqqww.com/模块化开发之CMD规范/

许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。

-------------本文结束感谢大佬们的阅读-------------