題目1： 為什么要使用模塊化？

前端開發中，起初只要在script標簽中嵌入幾十上百行代碼就能實現一些基本的交互效果，后來js得到重視，應用也廣泛起來了，jQuery，Ajax，Node.Js，MVC，MVVM等的助力也使得前端開發得到重視，也使得前端項目越來越復雜，然而，JavaScript卻沒有為組織代碼提供任何明顯幫助，甚至沒有類的概念，更不用說模塊（module）了，那么什么是模塊呢？

一個模塊就是實現特定功能的文件，有了模塊，我們就可以更方便地使用別人的代碼，想要什么功能，就加載什么模塊。模塊開發需要遵循一定的規范，否則就都亂套了。
模塊化的目的：

• 解決命名沖突
• 依賴管理
• 提高代碼可讀性
• 代碼解耦，提高復用性

題目2： CMD、AMD、CommonJS 規范分別指什么？有哪些應用

CommonJS

CommonJS是服務器端模塊的規范，Node.JS采用了這個規范。Node.JS首先采用了js模塊化的概念。根據CommonJS規范，一個單獨的文件就是一個模塊。每一個模塊都是一個單獨的作用域，也就是說，在該模塊內部定義的變量，無法被其他模塊讀取，除非定義為global對象的屬性。

輸出模塊變量的最好方法是使用module.exports對象。

//    文件名: foo.js

// 加載模塊
var $ = require('./jquery');
var _ = require('./underscore');
 
// 定義方法
function a(){};    //    私有方法，因為它沒在module.exports中 (見下面)
function b(){};    //    公共方法，因為它在module.exports中定義了
function c(){};    //    公共方法，因為它在module.exports中定義了
 
// 導出接口
module.exports = {
    b: b,
    c: c
};

AMD

AMD 即Asynchronous Module Definition，中文名是“異步模塊定義”的意思。它是一個在瀏覽器端模塊化開發的規范，服務器端的規范是CommonJS，模塊將被異步加載，模塊加載不影響后面語句的運行。所有依賴某些模塊的語句均放置在回調函數中。AMD是 RequireJS 在推廣過程中對模塊定義的規范化的產出。

// 文件名: foo.js
define(['jquery', 'underscore'], function ($, _) {
// 方法
function a(){}; // 私有方法，因為沒有被返回(見下面)
function b(){}; // 公共方法，因為被返回了
function c(){}; // 公共方法，因為被返回了

// 對外提供接口
return {
     b: b,
     c: c
    }
});

CMD

CMD 即 Common Module Definition 通?模塊定義，CMD規范是國內發展出來的，就像AMD有個requireJS，CMD有個瀏覽器的實現SeaJS，SeaJS要解決的問題requireJS?樣，只不過在模塊定義?式和模塊加載（可以說運?、解析）時機上有所不同。

Sea.js 推崇?個模塊?個?件，遵循統?的寫法。

// 文件名: foo.js

define(function(require, exports, module) {
var $ = require('./jquery.js')
var _ = require('./underscore');

// 方法
function a(){}; // 私有方法，因為沒有被返回(見下面)
function b(){}; // 公共方法，因為被返回了
function c(){}; // 公共方法，因為被返回了

// 對外提供接口
exports={
    b: b,
    c: c
}
});

題目3： 使用 requirejs 完善入門任務15，包括如下功能：

• 首屏大圖為全屏輪播
• 有回到頂部功能
• 圖片區使用瀑布流布局（圖片高度不一），下部有加載更多按鈕，點擊加載更多會加載更多數據(數據在后端 mock)
• 使用 r.js 打包應用

預覽
源代碼

瀑布流布局需要開啟服務器，本地驗證通過

使用r.js打包：

Paste_Image.png