seajs和requirejs技术指导文档

昨天到今天，老衲翻阅数十篇技术文档，为了搞明白seajs（CMD）和 requireJS（AMD）到底是个什么鬼，
当然也包括官网了，只是都不太尽如人意，理解起来感觉好费解，然后跟我的小伙伴交流了一晚上之后发现
了一个很形象的比喻，对于AMD和CMD的模式，其实理解的时候我借助了MVC这个结构来理解，感觉理解起来
相对容易一点儿，对于MVC这个结构我不做过多介绍，有兴趣的可以去看看
http://www.cnblogs.com/aaronjs/p/3581904.html
下面进入我们正题，说的不好的地方欢迎指正，一块学习进步.

咱们说道说道这两个模块儿开发的有趣的地方吧，我会用咱们常说的一句“我负责貌美如花，你负责挣钱养家”来
说道说道，其实说白了就是分工明确：
第一步、前端页面的引入接口，他的作用就是进去接口；（PS:前端页面直接展示给用户，相当于你的女朋友只负责貌美如
花，但是你需要提供，提供一切的物质支持就是money[对于requirejs和seajs来说就是给前端页面提供一个接口]）；
第二步、这个接口负责所有的依赖文件，还有需要的配置各种参数，支持文件等等。
换句话说就是页面上最直观的显示内容的调用方法，还有各种事件等等
（就相当于你，准备怎样让你的女朋友貌美如花。你要给提供化妆品、衣服之类的，没事肯定少不了）；
第三步、到了这一层，其实就是具体的逻辑的处理了，这一层的逻辑处理也是给第二层提供依赖的文件（
就相当于，你要给你的女朋友买这买那，你具体的工作是什么，做多少份兼职可以满足你的女朋友的物质需求）

上边儿说了这么多，其实就是为了想让大家理解一下requirejs和seajs这两种模块化开发的形式是什么，怎样分工的，
是不是多少有点儿进入状态了

first.咱们先来说一下requirejs

requirejs.png

页面的引入接口

<script data-main="js/app/r-index.js" src="js/lib/require.js"></script>

其中 r-index.js 就是相当于分工的第二步所在的位置，在这里边儿，我们进行依赖文件的配置，
和对第一步前端页面的显示的支持
我们来看一下r-index.js是怎样写的

requirejs.config({
    baseUrl: 'js/',
    paths: {
        hammer: 'lib/hammer.min',
        jquery:'lib/jquery.min',
        cookie:'lib/jquery.cookie',
        template:'lib/template'
    }
});

requirejs(['hammer', 'jquery', 'cookie','template','app/data'], function(a,b,c,template,service) {
    service.getAll();    
    service.getOne();
} 

对这个就是进行基础的业务的处理，

'app/data'就是具体的逻辑的处理，这些给第二步提供了所有的逻辑支持

下面我们来看一下 data.js data.js 所有第二步用到的逻辑都放在这里边进行处理

define(['jquery','cookie'],function () {
 return {
        /*所有数据*/
        getAll:function (){
          return alldata;
        },
        /*指定id的数据*/
        getOne:function (id){
            
        }
    }
})

有了上边儿requirejs 的案例基础我们来理解seajs的时候就方便的多了。
second.下面我们来看一下seajs的书写规范

seajs.png

首先说一下第一步，接口

<script>
    seajs.use('js/app/s-index.js');
</script>

然后看一下第二步的书写方式

define(function (requie, exports, module) {
    
    //依赖可以就近书写
    var hammer = require('js/lib/hammer.min');
    ...
    var app = requie('app/data');       
    app.getAll();
    app.getOne();
    ...
    //软依赖
    if (status) {
    
        var b = requie('./b');
        b.test();
    }
});

然后看一下第三步的书写方式

module.export =  {
        /*所有数据*/
        getAll:function (){
          return alldata;
        },
        /*指定id的数据*/
        getOne:function (id){
            
        }
    }
//需要注意的以下的写法是错误的
export =  {
        /*所有数据*/
        getAll:function (){
          return alldata;
        },
        /*指定id的数据*/
        getOne:function (id){
            
        }
    }

最后我们说一下requirejs和seajs的相同点和不同点
相同之处

RequireJS 和 SeaJS 都是模块加载器，倡导的是一种模块化开发理念，
核心价值是让 JavaScript 的模块化开发变得更简单自然。

不同之处，两者的区别如下：

定位有差异。RequireJS 想成为浏览器端的模块加载器，同时也想成为 Rhino / Node 等环境的模块加载器。
SeaJS 则专注于 Web 浏览器端，同时通过 Node 扩展的方式可以很方便跑在 Node 服务器端。

遵循的规范不同。RequireJS 遵循的是 AMD（异步模块定义）规范，SeaJS 遵循的是 CMD （通用模块定义）规范。
规范的不同，导致了两者 API 的不同。SeaJS 更简洁优雅，更贴近 CommonJS Modules/1.1 和 Node Modules 规范。

社区理念有差异。RequireJS 在尝试让第三方类库修改自身来支持 RequireJS，目前只有少数社区采纳。
SeaJS 不强推，采用自主封装的方式来“海纳百川”，目前已有较成熟的封装策略。

代码质量有差异。RequireJS 是没有明显的 bug，SeaJS 是明显没有 bug。

对调试等的支持有差异。SeaJS 通过插件，可以实现 Fiddler 中自动映射的功能，
还可以实现自动 combo 等功能，非常方便。RequireJS 无这方面的支持。

插件机制不同。RequireJS 采取的是在源码中预留接口的形式，源码中留有为插件而写的代码。SeaJS 采取的插件机制则与 JavaScript 语言
以及Node 的方式一致：开放自身，让插件开发者可直接访问或修改，从而非常灵活，可以实现各种类型的插件。

还有不少细节差异就不多说了。

总之，SeaJS 从 API 到实现，都比 RequireJS 更简洁优雅。如果说 RequireJS 是 Prototype 类库的话，则 SeaJS 是 jQuery 类库。

谢谢一下文档的参考
https://my.oschina.net/felumanman/blog/263330?p=1
https://github.com/seajs/seajs/issues/277
http://yslove.net/seajs/
https://github.com/seajs/seajs/issues/242
http://blog.csdn.net/wl110231/article/details/8283512