Javascript模块化编程

来源:互联网 发布:手机提示网络异常 编辑:程序博客网 时间:2024/06/17 05:18

背景:
因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。
但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱了套!考虑到Javascript模块现在还没有官方规范,这一点就更重要了。

commonJS

有一个全局性方法require(),用于加载模块。假定有一个数学模块math.js,就可以像下面这样加载。
  var math = require(‘math’);
然后,就可以调用模块提供的方法:
  var math = require(‘math’);
  math.add(2,3); // 5

可以看出上面的写法在浏览器端存在一些问题,因为浏览起上的文件都存放在服务器,因此加载速度和当前的网速有很大的关系。上面的写法只有当math.js完成后,才会执行下面的代码。如果require需要加载的模块非常大,那么下面的函数并不会执行,页面处于停顿状态。

因此,浏览器端的模块,不能采用”同步加载”(synchronous),只能采用”异步加载”(asynchronous)。这就是AMD规范诞生的背景。

AMD

AMD 即Asynchronous Module Definition,中文名是异步模块定义的意思。它是一个在浏览器端模块化开发的规范

由于不是JavaScript原生支持,使用AMD规范进行页面开发需要用到对应的库函数,也就是大名鼎鼎RequireJS,实际上AMD 是 RequireJS 在推广过程中对模块定义的规范化的产出.所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行。

require([module], callback); //依赖前置,依赖模块加载完成后执行callback

CMD

CMD 即Common Module Definition通用模块定义,CMD规范是国内发展出来的,就像AMD有个requireJS,CMD有个浏览器的实现SeaJS,SeaJS要解决的问题和requireJS一样,只不过在模块定义方式和模块加载(可以说运行、解析)时机上有所不同
语法
Sea.js 推崇一个模块一个文件,遵循统一的写法
define(id?, deps?, factory)
因为CMD推崇

一个文件一个模块,所以经常就用文件名作为模块id
CMD推崇依赖就近,所以一般不在define的参数中写依赖,在factory中写。这样需要哪个接口就可以调用哪个接口

原创粉丝点击