seaJS就是根据commonJS组织规范写的一个加载器。使用seaJs；seaJS环境中javascript的写法——模块化；模块化案例
一、初识seaJs
sea.js是一个加载器，是淘宝前端攻城师玉伯所著，他是根据commonjs规范的一种表现。何为commonJS？commonJs可以理解成一个组织，他们中的所有人都致力于提高javascript程序的可移植性以及可交互性。这种可移植性以及可交互性不仅仅局限于浏览器端，而且也包括了服务器端的javascript.
那seaJS到底是什么呢？seaJS就是根据commonJS组织规范写的一个加载器。其内部可API并不多主要有以下几个：alias，config，use，define。主要就这四个API。seaJS主要就是根据这四个API对其环境中的javascript进行管理的。那么seaJS是如何对其环境中的代码管理的？
在先前的页面中，不管前端程序员还是后端程序员，在他们需要某一个js的时候，有人可能会直接写行内js，而有些人则习惯于从外部引入js文件。项目后期维护的时候，杂乱的页面不仅加大了维护的成本，而且维护起来也很不方便。这个时候就可以用seaJS来维护我们的这杂乱无序的js文件。
seaJS的利是远大于弊的，这个至少在大项目中可以体现。在比较小的项目中seajs还是舍弃比较好啊，可能会出现适得其反的效果。大家在使用之前一定要做好前期评估。
那到底如何使用seaJS呢？
二、使用seaJs
在使用seaJS之前难免一定要先引入它，就如我们使用jquery一样。
1、seaJS环境中javascript的写法——模块化
模块化？何为模块化？在seaJS中的所有javascript都必须要依据模块化的书写格式。这又是什么意思？其实，seaJS在管理文件的过程中是根据javascript（这里我们先讨论seaJS对javascript的管理，对于CSS的管理我们后面再做讨论）的文件名进行管理的，这个文件名就相当于我们平时所说的命名空间。在调用文件的时候我们可以直接写文件名而不需要写它的后缀。但是也是有特殊情况的：
a.加载css的时候一定要加后缀的
b.路径中有”？“的时候javascript文件的后缀不能省略
c.路径中是以“#”号结尾的文件也不可以省去后缀
到底如何模块化一个javascript？这个时候就要用到我们seaJS提供的几个接口了，模块化使用define函数，如下：
define(id,deps,factory)
id：模块id，可以自己赋值，如果不赋值默认就是该函数的相对路径，各位可以调试看看
deps：当前模块所依赖的模块，这里关键就是按需加载了，将你需要的js文件引入
factory：模块工厂函数，这个函数是重点，主要是模块的逻辑实现
2、模块化案例
说了这么多，肯定还是有人是云里雾里，那么我们就给出一个具体例子：
moduleA.js：
define(function(require,exports,module){ //这里开始，你可以随意书写你的js代码，声明变量，定义函数，做任何你想做的事 })
define(function(require,exports,module){
//这里开始，你可以随意书写你的js代码，声明变量，定义函数，做任何你想做的事
})
不是说模块化后就能按需加载么？按需加载后，我怎么去调用模块化后文件内的方法呢？是的，这个问题就牵涉到了我们define函数的参数——内部工厂函数
function（require，exports，module）{}，这个函数的三个参数在书写的时候不能写错，不能改变这三个参数的任意一个字母（强制性）。但是这三个参数中的require和module是可以省略的，这个不是我们本期讨论的话题。言归正传：
moduleB.js：
define(function(require,exports,module){ //这里开始代码var a=”hello world!” exports.getA=function(){return a;}
})
现在我们拿上面的moduleB和moduleA进行简单的seajs的模块化管理：
如果moduleA也需要拥有moduleB中一样的getA方法。以前大家都是直接在moduleA中也加一个方法getA，这样明显在重复“造轮子”，为什么我们不去拿别人先前已经写好了的呢？所以，我们在seajs的环境中可以进行下面的操作
moduleA：
define(function(require,exports,module){
var moduleb=require(“moduleB”)
//这样后就要可以调用moduleB.js中的getA方法了
moduleb.getA();//”hello world!”
})
seajs管理代码模块基本就是这种流程，对于define内的工厂函数，我们在写模块的时候一定要注意一下几点：
1、require，exports，module这三个参数不能写错
2、require：是用来引入相关模块的，就如按需加载，需要哪一个模块就require进来，然后就可以利用这个模块中的方法了，前提是如果要使用require进来的模块中的代码那么这个模块中的公用函数就必须要定义在exports中
3、exports：用来定义包含外部公用的一些内容，包括变量，函数等。这个也可以理解成与其他模块的接口。
4、module：模块的元数据，他本身是一个对象，拥有对象的一切特性（原型对象等）
这样的描述是对seaJS的一个小规模的使用方法，其实seaJS内部包含了很强大的用处，各位可以查看seaJS官网文档：http://www.seajs.com
后面我将逐步开始分析如何使用seaJS以及在使用的注意点
本文地址：https://www.pizijiang.com/tougao/113794.html
举报投诉邮箱：253000106@qq.com
微信扫一扫 
支付宝扫一扫 
