題目1： 為什么要使用模塊化？
- 可以避免命名沖突
- 對文件的依賴項進行統一管理
- 提高代碼的可讀性和維護性
- 提高頁面的性能
題目2： CMD、AMD、CommonJS 規范分別指什么？有哪些應用
- CommonJS 規范：根據 CommomJS 規范，一個單獨的文件就是一個模塊。每一個模塊都是一個單獨的作用域，也就是說，在該模塊內部定義的變量，無法被其他模塊讀取，除非定義為global對象的屬性。這個規范同時定義了 module.exports 對象為模塊的出口，我們需要把想要輸出的內容放到 module.exports 對象中；定義了 require 方法為加載模塊的方式。這一規范主要應用在服務端的JS，即NodeJS上。例子如：
// 這里是a.js
var name = 'a';
// 輸出name
module.exports = {
name: name
}
// 這里是b.js
var a = require('a'); // 使用require方法加載模塊，并返回模塊內部的 module.exports 對象
a.name; // a
- AMD 規范：AMD 規范的意思是異步模塊定義的意思，由 RequireJS 在推廣模塊化定義的過程中產出。 這個規范用于瀏覽器模塊化的開發，主要解決了兩個問題：
- 多個js文件可能有依賴關系，被依賴的文件需要早于依賴它的文件加載到瀏覽器
- 加載的時候瀏覽器會停止頁面渲染，加載文件越多，頁面失去響應時間越長
例子如：
// 這里是a.js
// define函數的第一個參數為依賴項數組，即想要加載的模塊：例如jquery
// 第二個參數為回調函數，等模塊加載完畢后會把加載的模塊傳到回調函數里
define(['jquery'], function ($) {
var name = 'a';
return {
name: name
} // 這里是模塊輸出，讓別的模塊能夠使用
});
// 這里是b.js
// 加載模塊a
// 等到所有模塊都加載完畢后再執行回調函數并把模塊傳到回調函數
require(['jquery', 'a'] function ($, a) {
a.name; // a
})
- CMD 規范：CMD 規范與 AMD 規范類似，但兩者的模塊加載時機和模塊定義的方式不同。使用這個規范的主要是 SeaJS，例子如：
// 這里是a.js
define(function (require, module, exports) {
var $ = require('jquery'); // 與AMD規范不同的是，CMD規范是要用到模塊的時候再加載，而AMD規范是先把所有模塊加載完后再用
$('div').addClass('active');
})
// 這里是b.js
// 使用模塊a
seajs.use(['a.js'], function(a){
// todo
});
題目3： 使用 requirejs 完善入門任務15，包括如下功能
代碼地址：https://github.com/a625689014/requirejs
預覽地址：https://a625689014.github.io/requirejs/page.html
注：預覽鏈接加載時間較長，瀑布流圖片墻在本地mock成功
image.png
