為什么學習RequireJS？
像我這種菜鳥，會提到海量文章里提到的AMD、JS模塊化編程、異步... ... 等等
RequireJS會讓你以不同于往常的方式去寫JavaScript。你將不再使用script標簽在HTML中引入JS文件，以及不用通過script標簽順序去管理依賴關系。
RequireJS是一個Javascript 文件和模塊框架，它可以幫我們去管理js代碼（我的理解）。
深入學習，我們便會被迫接受一系列的名詞：data-main、require、define、baseUrl、paths、shims、deps。。。等等；
總之，很多文章都在向我們推銷一些自己都說不明白的名詞和概念。
簡單點，現在我們要做一個簡單的需求，用RequireJS管理我們的js代碼，還要能使用jquery！
1.構建一個web工程，跑起來！
里面文件如圖：
這里面有好多坑，所以我把文件都放在文件根目錄，先排除掉這些小問題！
其中jquery.js和require.js是需要去網站下載的，請自行百度。
2. 在index.jsp中添加script標簽
可以在<body>里添加一個標簽 <p>RequireJS異步加載測試</p>
3. 補充main.js文件
require.config({ paths: { jquery: 'jquery-2.1.1' }});require(['jquery'], function($) { alert($().jquery);});4.跑起來~
你會看到彈出框，頁面已經渲染顯示了 “RequireJS異步加載測試” 。
小結：
a. RequireJS由James Burke創建，他也是AMD規范的創始人。它是一個工具庫，用于客戶端的模塊管理。
從本例體現出的：
1. 彈出alert的時候頁面同時也被渲染，體現了異步加載的功能，傳統放在head中的寫法會造成阻塞，只有點擊確定后才能渲染頁面。
2. 頁面只需要引入一個require.js，不需要再引入其他繁多復雜的js代碼，剩下的工作交給RequireJS框架來做！
b. 學習之前先了解AMD規范，AMD通過define來定義模塊，基本模式：define("id",[deps1,deps2,...],callback);
為什么本例沒有define就可以跑起來？ 因為jquery提供了對AMD的支持。path對象即是用來引入各種模塊的。
普通的js代碼可否被RequireJS管理？ 可以，使用shims來加載這些資源！
c. 總結以后的編碼思路：
Xx.jsp Xx.js(同main.js) 通過 require.config 引入各種js模塊（資源）；require加載所需模塊，并在回調函數中傳入對應變量，以方便在其中直接調用各模塊中的函數和變量。
d. 自己實現： 頁面加一個按鈕；在main.js中加入juqery的click監聽事件，測試是否監聽成功！
e. 遺留問題：路徑問題，肯定不能在根目錄，不過這都不是事兒！
本文就是關于RequireJS入門一之實現第一個例子的全部敘述，希望對大家有所幫助。
新聞熱點
疑難解答
