题目1: 为什么要使用模块化?
最主要的目的:
- 解决命名冲突
- 依赖管理
其他价值
- 提高代码可读性
- 代码解耦,提高复用性
题目2: CMD、AMD、CommonJS 规范分别指什么?有哪些应用
- CommonJS(NodeJS服务端采用了CommonJS)
-
在一个模块中,存在一个自由的变量”require”,它是一个函数。
- 这个”require”函数接收一个模块标识符。
- “require”返回外部模块所输出的API。
- 如果出现依赖闭环(dependency cycle),那么外部模块在被它的传递依赖(transitive dependencies)所require的时候可能并没有执行完成;在这种情况下,”require”返回的对象必须至少包含此外部模块在调用require函数(会进入当前模块执行环境)之前就已经准备完毕的输出。
- 如果请求的模块不能返回,那么”require”必须抛出一个错误。
1 //sum.js 2 exports.sum = function(){...做加操作..}; 3 4 //calculate.js 5 var math = require('sum'); 6 exports.add = function(n){ 7 return math.sum(val,n); 8 };
在一个模块中,会存在一个名为”exports”的自由变量,它是一个对象,模块可以在执行的时候把自身的API加入到其中。
3 .模块必须使用”exports”对象来做为输出的唯一表示
-
AMD
AMD是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义"。它采用异步方式加载模块,模块的加载不影响它后面语句的运行。所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行。
实现AMD的库有RequireJS
、curl
、Dojo
等。AMD就只有一个接口:
define(id?,dependencies?,factory);
id: 定义中模块的名字,可选;如果没有提供该参数,模块的名字应该默认为模块加载器请求的指定脚本的名字。。
依赖dependencies:是一个当前模块依赖的,已被模块定义的模块标识的数组字面量。 依赖参数是可选的,如果忽略此参数,它应该默认为["require", "exports", "module"]。然而,如果工厂方法的长度属性小于3,加载器会选择以函数的长度属性指定的参数个数调用工厂方法。
工厂方法factory,模块初始化要执行的函数或对象。如果为函数,它应该只被执行一次。如果是对象,此对象应该为模块的输出值。
//AMD define(['./a', './b'], function(a, b) { // 依赖必须一开始就写好 a.doSomething() b.doSomething() })
-
CMD
CMD(Common Module Definition)是 SeaJS推广过程中产生的。在 CMD 规范中,一个模块就是一个文件。
``` define(factory); ```
- 一个文件一个模块,所以经常就用文件名作为模块id
- CMD推崇依赖就近,所以一般不在define的参数中写依赖,在factory中写
// CMD define(function(require, exports, module) { var a = require('./a') a.doSomething() var b = require('./b') // 依赖可以就近书写 b.doSomething() })
题目3: 使用 requirejs 完善入门任务15,包括如下功能:
- 首屏大图为全屏轮播
- 有回到顶部功能
- 图片区使用瀑布流布局(图片高度不一),下部有加载更多按钮,点击加载更多会加载更多数据(数据在后端 mock)
- 使用 r.js 打包应用(可选)