if(xx){
//.......
}
else{
//xxxxxxxxxxx
}
for(var i=0; i<10; i++){
//........
}
element.onclick = function(){
//.......
}
<script type="text/javascript" src="a.js"></script> <script type="text/javascript" src="b.js"></script>
modA = function(){
var a,b; //变量a、b外部不可见
return {
add : function(c){
a + b + c;
},
format: function(){
//......
}
}
}()
app.util.modA = xxx; app.tools.modA = xxx; app.tools.modA.format = xxx;
app.tools.modA.format();
(function(window){
//代码
window.jQuery = window.$ = jQuery;//通过给window添加属性而暴漏到全局
})(window);
1. 模块的标识应遵循的规则(书写规范)2. 定义全局函数require,通过传入模块标识来引入其他模块,执行的结果即为别的模块暴漏出来的API3. 如果被require函数引入的模块中也包含依赖,那么依次加载这些依赖4. 如果引入模块失败,那么require函数应该报一个异常5. 模块通过变量exports来向往暴漏API,exports只能是一个对象,暴漏的API须作为此对象的属性。
//math.js
exports.add = function() {
var sum = 0, i = 0, args = arguments, l = args.length;
while (i < l) {
sum += args[i++];
}
return sum;
};
//increment.js
var add = require(‘math‘).add;
exports.increment = function(val) {
return add(val, 1);
};
//program.js var inc = require(‘increment‘).increment; var a = 1; inc(a); // 2
1. 全局有一个module变量,用来定义模块2. 通过module.declare方法来定义一个模块3. module.declare方法只接收一个参数,那就是模块的factory,次factory可以是函数也可以是对象,如果是对象,那么模块输出就是此对象。4. 模块的factory函数传入三个参数:require,exports,module,用来引入其他依赖和导出本模块API5. 如果factory函数最后明确写有return数据(js函数中不写return默认返回undefined),那么return的内容即为模块的输出。
//可以使用exprots来对外暴漏API
module.declare(function(require, exports, module)
{
exports.foo = "bar";
});
//也可以直接return来对外暴漏数据
module.declare(function(require)
{
return { foo: "bar" };
});
1. 用全局函数define来定义模块,用法为:define(id?, dependencies?, factory);2. id为模块标识,遵从CommonJS Module Identifiers规范3. dependencies为依赖的模块数组,在factory中需传入形参与之一一对应4. 如果dependencies的值中有"require"、"exports"或"module",则与commonjs中的实现保持一致5. 如果dependencies省略不写,则默认为["require", "exports", "module"],factory中也会默认传入require,exports,module6. 如果factory为函数,模块对外暴漏API的方法有三种:return任意类型的数据、exports.xxx=xxx、module.exports=xxx7. 如果factory为对象,则该对象即为模块的返回值
//a.js
define(function(){
console.log(‘a.js执行‘);
return {
hello: function(){
console.log(‘hello, a.js‘);
}
}
});
//b.js
define(function(){
console.log(‘b.js执行‘);
return {
hello: function(){
console.log(‘hello, b.js‘);
}
}
});
//main.js
require([‘a‘, ‘b‘], function(a, b){
console.log(‘main.js执行‘);
a.hello();
$(‘#b‘).click(function(){
b.hello();
});
})
define([‘a‘, ‘b‘, ‘c‘, ‘d‘, ‘e‘, ‘f‘, ‘g‘], function(a, b, c, d, e, f, g){ ..... })
define(function(){
console.log(‘main2.js执行‘);
require([‘a‘], function(a){
a.hello();
});
$(‘#b‘).click(function(){
require([‘b‘], function(b){
b.hello();
});
});
});
var a = require(‘a‘);
a.hello();
$(‘#b‘).click(function(){
var b = require(‘b‘);
b.hello();
});
//d.js
define(function(require, exports, module){
console.log(‘d.js执行‘);
return {
helloA: function(){
var a = require(‘a‘);
a.hello();
},
run: function(){
$(‘#b‘).click(function(){
var b = require(‘b‘);
b.hello();
});
}
}
});
require([‘d‘], function(d){
});
//a.js
define(function(require, exports, module){
console.log(‘a.js执行‘);
return {
hello: function(){
console.log(‘hello, a.js‘);
}
}
});
//b.js
define(function(require, exports, module){
console.log(‘b.js执行‘);
return {
hello: function(){
console.log(‘hello, b.js‘);
}
}
});
//main.js
define(function(require, exports, module){
console.log(‘main.js执行‘);
var a = require(‘a‘);
a.hello();
$(‘#b‘).click(function(){
var b = require(‘b‘);
b.hello();
});
});
var b = require.async(‘b‘); b.hello();
//方式一, a.js
export var a = 1;
export var obj = {name: ‘abc‘, age: 20};
export function run(){....}
//方式二, b.js
var a = 1;
var obj = {name: ‘abc‘, age: 20};
function run(){....}
export {a, obj, run}
import {run as go} from ‘a‘
run()
module foo from ‘a‘ console.log(foo.obj); a.run();
原文:http://www.cnblogs.com/cnblogs-jcy/p/6903061.html