标签：
参考：http://chaoskeh.com/blog/why-seajs.html
https://github.com/seajs/seajs/issues/547
一个月前，打开博客园想看下小坦克写的文章，发现文章不见了，一个星期前，想看下放在收藏夹的Sea.js的文章，不幸的是这篇文章是发布在百度空间的，百度空间停了，文章也因此无法查看了，由于本人比较笨，又没有什么基础，花了好久时间才把Sea.js的基本用法给琢磨出来，其实以前也琢磨出来过N次，但是苦于没有机会去使用，没过几天又忘了，哪天想到了，又重新开始琢磨。。。想到开头的提到的两件不幸的事情，我想 还是我多敲下键盘，自己把Sea.js的用法给记录下来吧，这样以后忘记了，就可以直接打开我的博文查看了，也不会丢失了。
做项目的时候，我们经常会把常用的JS方法给封装起来放到util.js里面，这样以后用起来特别方便，直接调用即可，比如：
function add(number1,number2){ }
人家也会因此感激你：太好了，都封装好了，直接调用就可以了，省下了我不少时间。
但是当项目越来越大，就经常会出现方法重名的情况，导致各种各样的冲突,为了解决冲突，不得不修改方法名，最后，你的util.js 会变成这样：
function add1(number1,number2){ } function add2(number1,number2){ } function add3(number1,number2){ }
“这是什么鬼？！”本来一个很好的util.js竟然变成这样了，还能开心的撸代码吗？
为了解决这问题，我们会采用另外一种方法来封装JS：
var temp=new Object(); temp={ sayHello:function say(str) { alert(str); } }
这也是常见的一种方式，可以较好的解决命名冲突的问题，但是这也会引发另外一个问题，就是调用的时候比较麻烦，需要这么去调用：
<script> temp.sayHello("你好"); </script>
看起来还是挺简单的啊，的确现在看起来确实没什么问题，但是如果这样呢?
var temp = new Object(); temp = { sayHello: function say(str) { alert(str); }, show: { showStr: function funName(str) { alert(str); } } }
嵌套多了一层，那么相应的调用也更复杂了：
temp.show.showStr("你好啊");
这显然不是一个太好的解决方法。
在写JS的时候，还会经常遇到一个问题，就是依赖的问题，请看下面的例子：
A.js:
function say(){ print(); }
B.js:
function print(){ console.log("你好"); }
A.js的say方法调用了B.js的pirnt方法，如果你的页面没有引用B.js,只引用了A.js,那么恭喜你，脚本报错。
我们在页面中会引用好多JS，打开网页的时候，浏览器会下载页面中引用的所有的JS文件，哪怕这个JS文件是触发了某事件才有效的。
为了解决上面的问题，所以Sea.js诞生了。
只要在页面中引用Sea.js就可以获得Sea.js遵循的CMD环境了：
<script src="sea.js"></script>
既然获得了CMD环境，那么我们的代码也就要遵循CMD规范了:
define(function (require, exports) { exports.click=function(){ alert("点击按钮了"); }; });
简单的看下代码，发现 只是外面 嵌套了一层
define(function (require, exports) { });
其余也没什么不一样的地方，当然还有一个关键的地方:
exports.click=function(){ alert("点击按钮了"); };
这代表我这个js向外暴露的接口就是一个click方法。
那么该怎么调用这个方法呢（假设这个js文件是util）？
<script> seajs.use("util",function(a){a.click()}); </script>
在页面中，只要申明 我现在需要使用util这个模块，帮我引用进来吧，这样util模块就乖乖的引用进来了，自然可以调用util向外暴露的click方法了。
这就是sea.js最基本的使用方法了，下面再来看看它是如何解决 JS依赖的 问题的：
define(function (require, exports) { var a=require("jquery-2.1.1.min.js"); exports.run=function(){ alert("运行吧"); $("body").text("运行吧"); }; });
一个require函数便搞定了这个问题，它告诉浏览器，现在我需要jquery插件，帮我引用进来吧，然后jquery插件便出现了。
这是Sea.js的魔力，并且这个这个函数是同步执行的。
当我们要让js按需加载，也非常简单，只需用到require.async函数，这样只有在触发body的click事件的时候，浏览器才会去下载util模块
$("body").click(function(){
require.async("util",function(a){
a.click();
});
});
标签：
原文地址：http://www.cnblogs.com/CodeBear/p/4552305.html
