具体的理论就不讲了，可以参考
http://www.ruanyifeng.com/blog/2012/10/javascript_module.html
http://www.ruanyifeng.com/blog/2012/10/asynchronous_module_definition.html
http://www.ruanyifeng.com/blog/2012/11/require_js.html
直接上demo
首先创建文件，其中define的是采取amd格式定义的
|
1
2
3
4
5
6
7
8
9
|
// add.js define(function (){ var add = function (x,y){ return x+y; }; return { add: add }; }); |
|
1
2
3
4
5
6
7
8
9
|
// multiply.jsdefine(function (){ var multiply = function (x,y){ return x*y; }; return { multiply: multiply };}); |
|
1
2
3
4
5
6
7
8
9
10
11
|
// divide.jsdefine(function(){ var divide=function(a,b){ return a/b; }; return { divide:divide }; }) |
|
1
2
3
4
5
|
// noAMD.jsfunction testm(a,b){ return a-b;}window.test=test2; |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
//main.js require.config({ baseUrl:"js", paths: { "js1": "add", "js2": "divide", "js4":"noAMD" }, shim:{ "test":{ exports:"js4" } } });require(["js1","js2","js/multiply",'js4'],function(j1,j2,j3,j4){ var a=21,b=3; alert(j1.add(a,b)); alert(j2.multiply(a,b)); alert(j3.divide(a,b)); alert(testm(a,b))}) |
|
1
2
3
4
5
6
7
8
9
10
|
<html> <head> <meta name="generator" content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" /> <title></title> <script src="require.js" data-main="main" defer async="true"> </script> </head> <body></body></html> |
此处需要注意非amd格式编写的，需要使用shim
文件：r9.zip