相信不只我一个人对模块化这里感觉不熟练,因为commonJS、AMD、CMD真的很容易把人弄得云里雾里,本着“服务他人,方便自己”的原则,特整理这篇文章,希望对大家有帮助。
- WHY(为什么要使用模块化?)
解决全局变量的命名冲突问题,每个模块相当于一个独立的空间,即使不同模块中的某些变量命名相同也完全没有关系。
就好像,中国有一HARRISKNG,恰好美国也有一个,我们俩在不同的国家,不会相互影响彼此的生活,反正国家之间的对接是由外交部长来进行的,这是一个道理;解决依赖的模块顺序问题,即假设你需要引用jQuery,则jQuery必须在改文件之前被加载,但是当加载文件数量增加,这种管理将会非常复杂,因此需要规范来解决。
-
WHAT(模块化规范介绍)
-
AMD
是浏览器端运行的模块化规范。
主要是为了解决:- 文件依赖顺序问题
- 页面渲染阻塞问题
-
这里将重点讲解requireJS来对AMD规范进行深入解析,具体见下一篇
CMD
即seajs,是中国出品。commonJS
具体形式:(node端运行)
//a.js
var name = "harrisking";
function sayName(){
console.log(name);
}
function sayHello(){
console.log('hello'+' '+name);
}
module.exports = {
sayHello : sayHello,
sayName : sayName
}
//b.js
var nameModule = require('./a.js');
nameModule.sayName();
nameModule.sayHello();
或者
var people = {
name: 'harrisking',
age:23,
saysth: function(){
console.log('hello,my name is '+this.name+',my age is '+this.age);
}
}
module.exports = people;
var info = require('./a.js');
info.saysth();
- RELATION(规范关系图)