JS模块化工具requirejs简易教程

一  requirejs的作用

a)  防止命名冲突，requirejs可以将我们的变量都封装在变量内，通过暴露出一些接口而解决这个问题

b)  解决不同js之间的依赖

c)  可以让我们的代码以模块化的方式组织！

使用require你不用再以script标签引入js文件（除了require.js），它会按需要动态加载。

二  怎么学习使用requirejs

以下是最常用的几个函数

d)  requirejs.config   为模块指定别名，方便模块的引入（起别名的地方）

e)  requirejs  通过它将写好的模块进行引入，并根据这些引入的模块编写主代码（组合模块的地方）

f )   define  用它编写模块，在相应的地方引入（定义自己模块的地方）

三  简单实例

A  把body的背景色变成红色

代码结构（main.js和index.html是我们自己编写，另外的jquery和requirejs是下载好的）

index.html内容（data-main属性后跟“入口文件”，入口文件是指require加载完成后立即会去执行的js文件，完整的其实是js/main.js，require会自动在末尾加".js"，所以我们不用加）

main.js的内容（ 第二段代码是用requirejs调用刚才定义的jquery，第二个参数是一个回调函数，回调函数有一个参数$，代表了前面第一个方括号中的参数jquery ）
）

B  以模块化的方式写一个登录验证

模块化的好处是，每人负责不同的模块，别人用的时候不必知道这个模块里有什么。

代码结构

index.html和之前一样，只引入require.js，主要写validate.js和main.js

先定义validate.js （ 函数中是一个独立的空间，无法和外界交互，只有return返回的值能被外面访问，所以，所有函数都写在return中 ）

再写main.js （ 第二个函数中的前面的数组中是此函数需要的依赖，后面的函数的形参列表是前面依赖的形参。这样函数中可以根据形参引用对应模块的方法啦！ ）

虽然简单，但清晰明了的说明了requirejs怎么用。

requirejs介绍到这里已经够用了，主要是如何使用define将一个个功能定义成模块。