一、seajs

　　1. 使用seajs的一般步骤

　　　　a)在主页面引入sea.js

　　　　b)写模块

　　　　c)在主页面使用模块

　　2.模块的写法

　　math.js

 define(function(require, exports, module){

     var squareObj=require("square");

     module.exports={

         add:function(a,b){

             return a+b;

         },

         cube:function(a){

             return squareObj.square(a)*a;

         }

     }

 })

　　square.js

define(function(){

    return {

        square:function(a){

            return a*a;

        }

    }

})

　　define是定义一个模块的固定用法，其中的参数分别表示：

　　　　require：依赖的文件，里面的参数是相对于sea.js文件的路径

　　　　exports：可以导出方法，但是它不能导出对象

　　　　module.exports:既可以导出方法，也可以导出对象

　　　　如果需要导出的方法有多个就用module.exports,只有一个就用exports。

　　　　这些参数都不是必须的，但是一定要注意，如果你要用exports，前面必须有require，因为参数的位置不能变。

　　　3.使用模块　　

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <script src="sea-debug.js"></script>

    <script>

        seajs.config({

            base:"module",

            alias:{

                query:"jquery-1.12.4"

            }

        })

        seajs.use("math.js",function(obj){

            console.log(obj.add(8,3));

            console.log(obj.cube(8,3));

        })

    </script>

</head>

<body>

</body>

</html>

　　seajs.config：配置seajs，base是设置目录，alias是设置别名

　　seajs.use：使用模块

　　参数一：使用到的模块的路径，因为base设置了基本路径，所以这里的路径是在基本路径上的路径；如果使用到了多个模块，就用数组包裹多个模块

　　参数二：函数，函数里面的参数表示的是每个模块返回的对象，有多个模块就有多个对象，在这个函数里面就可以使用模块里的方法

二、requirejs

　　requirejs和seajs的用法基本相同，先引入，写模块，最后使用模块，区别在于使用模块上。

　　requirejs的使用模块：　

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <script src="require.js"></script>

    <script>

        requirejs.config({

            baseUrl:"scripts/module",

        })

        requirejs(["math.js"],function(obj){

            console.log(obj.add(8,3));

            console.log(obj.cube(8,3));

        })

    </script>

</head>

<body>

</body>

</html>

三、seajs和requirejs的区别　　　

　　1、 requirejs可以在引入require.js的script标签中设置模板加载选项，这样可以加载第一个模块

　　　　<script data-main="script/main" src="require.js"></script>

　　2、 requirejs的配置中设置基本路径的属性为baseUrl，它的路径是相对于该页面的路径

　　3、 requirejs使用模块时不需要写.use,它的第一个参数一定是个数组，即使它只引入一个模块，也要用数组的形式

　　4、 seajs是懒加载，懒加载就是什么时候调用，什么时候加载，requirejs是预加载，先加载完毕，然后再执行，所以在一些输出上的顺序会不同

　　5、 seajs是基于cmd规范，requirejs是基于amd规范

四、seajs使用jquery

　　因为seajs是基于cmd规范，而jquery是基于amd规范，所以seajs在使用jquery的时候，需要将jquery的规范也改成cmd

　　在这里我修改的是jquery-1.12.4.js，修改的位置在10972行 ，将amd改成了cmd，注释的部分为原来的代码，下面的代码是修改的

if ( typeof define === "function" && define.cmd ) {

    //define( "jquery", [], function() {

    //    return jQuery;

    //} );

    define(function(require,exports,module){

        module.exports=jQuery;

    });

}

五、其它小知识点

　　1、 在写路径的时候，“main.js”可以写成”main“，因为在seajs和requirejs的内部会为我们加上.js

　　2、 如果路径相对于正在编写的文件目录在同一级，可以使用"./main"来加载路径 ，./就是在此文件目录下查找

　　3、模块中，可以用exports导出方法，用module.exports导出对象或方法，还可以用return导出对象或方法

　　4、seajs和requirejs的原理就是创建script标签，src等于要引入的文件路径，追加到head后面，引用完后再移除

　　

　　

seajs和requirejs的更多相关文章

  1. SeaJS与RequireJS最大的区别

    SeaJS与RequireJS最大的区别 U_U 2013-06-20 16:21:12 执行模块的机制大不一样-----------------------------------由于 Requir ...

  2. seajs和requirejs对比；node初识

    seajs 引包 载入主模块(seajs.use('./main')) 定义模块define(function(require,exports,module)) 模块化的好处 1.开发效率高 2.可以 ...

  3. SeaJS 与 RequireJS 的差异对比

    这篇文章主要介绍了SeaJS 与 RequireJS 的差异对比,本文主要对CMD规范和AMD规范的弊端做了对比,并做出了一个总结,需要的朋友可以参考下 “历史不是过去,历史正在上演.随着 W3C 等 ...

  4. SeaJs与RequireJs执行差异

    seajs与requirejs在模块的加载方面是没有差异的,无论是requirejs在定义模块时定义的依赖模块,还是seajs在factory函数中require的依赖模块,在会在加载当前模块时被载入 ...

  5. seajs与requirejs

    1 seajs暴露的两个对象 二 define()定义 引用模块 三插件 css插件和requirejs插件 4 seajs使用和建议

  6. 从Java的角度理解前端框架，nodejs，reactjs，angularjs，requirejs，seajs

    [前端神秘的面纱] 对后端开发来说,前端是神秘的, 眼花缭乱的技术,繁多的框架, 如果你还停留在前端等于只用jquery做开发,那么你out了, 本文从Java的角度简述下目前前端流行的一些框架. 水 ...

  7. RequireJS 和 SeaJS

    RequireJS SeaJS CMD规范 CommonJS的规范: 根据CommonJS规范,一个单独的文件就是一个模块.加载模块使用require方法,该方法读取一个文件并执行,最后返回文件内部的 ...

  8. 对比requirejs更好的理解seajs

    seajs遵循CMD规范,requirejs遵循AMD规范.AMD规范是预加载,CMD规范是赖加载. 下文举例假设有文件 b.js, c.js如下 //b.js define(function(req ...

  9. requirejs和seajs使用感受

    这几天看了下前端模块化的知识,主要是requirejs和seajs相关的知识,还未看es6的模块化知识. 由于目前项目组内的开始推广使用vue,并且开始简单的封装组件,但发现组件js的使用方式依然是原 ...

随机推荐

  1. jquery-leonaScroll-1.1-自定义滚动条插件

    leonaScroll-1.1最新版-竖向 leonaScroll-1.1.js欢迎使用leonaScroll-1.1.js,此滚动条仅支持竖向滚动,如您在使用过程中发现更多问题,欢迎指正! 更新:1 ...

  2. c#编码转换

    /// <summary> /// URL编码 /// </summary> /// <param name="Source"></par ...

  3. iis虚拟目录名称“ReportServer”的巧合

      今天测试一个Crystal Report网站的报表服务,建立一个虚拟目录,名为ReportServer,结果无论怎样访问浏览器都返回 localhost/ReportServer - / Micr ...

  4. CSS命名规范

    DIV+CSS规范命名大全集合 前端人员必看CSS命名规范 整理: 文件名必须由小写字母.数字.中划线组成 ).所有的命名最好都小写,一律采用小写加中划线的方式,不允许使用大写字母或 _2).属性的值 ...

  5. Alpha阶段第八次Scrum Meeting

    情况简述 Alpha阶段第八次Scrum Meeting 敏捷开发起始时间 2016/10/31 00:00 敏捷开发终止时间 2016/10/32 00:00 会议基本内容摘要 跟助教进行了交流,明 ...

  6. C#使用 DirectX SDK 9做视频播放器 并在视频画线添加文字 VMR9

    视频图像处理系列 索引 VS2013下测试通过. 在百度中搜索关键字“DirectX SDk”,或者进入微软官网https://www.microsoft.com/en-us/download/det ...

  7. linux 安装 ArcSDE10.1

    实验仍未成功,步骤仅供参考. 1:首先检查一下在Linux操作系统下Oracle数据库是否能启动,是否能连通等 [oracle@localhost ~]$ sqlplus SQL*Plus: Rele ...

  8. 深入理解javascript原型和闭包（12）——简介【作用域】

    提到作用域,有一句话大家(有js开发经验者)可能比较熟悉:“javascript没有块级作用域”.所谓“块”,就是大括号“{}”中间的语句.例如if语句: 再比如for语句: 所以,我们在编写代码的时 ...

  9. tyvj1004 滑雪

    描述     trs喜欢滑雪.他来到了一个滑雪场,这个滑雪场是一个矩形,为了简便,我们用r行c列的矩阵来表示每块地形.为了得到更快的速度,滑行的路线必须向下倾斜.    例如样例中的那个矩形,可以从某 ...

  10. codevs2777 栅栏的木料

    题目描述 Description 农民John准备建一个栅栏来围住他的牧场.他已经确定了栅栏的形状,但是他在木料方面有些问题.当地的杂货储存商扔给John一些木板,而John必须从这些木板中找出尽可能 ...