應用本身也可以分解成為多個相互互動的小部分,學習封裝**的技能,把**視作自成一體的元件,學習如何設計優秀的介面,如何安排介面;學習如何隱藏資料,只開放使用者需要的部分。
如何解析依賴,避免手動維護一組有序的script標籤。
封裝是為了讓功能自成一體,隱藏實現的細節。任何**，不管是函式還是模組，都要有明確的職責；隱藏實現的細節，提供簡明的api一滿足使用的需求。功能自成一體的**易於理解和修改。
1).理解單一職責原則
2).資訊隱藏和介面
3).作用域和this關鍵字1).閉包和模組化
(function())();注意:這個函式放在了一堆括號中,不僅告訴了直譯器我們宣告了乙個匿名的函式,還表明我們可以把它當作乙個值使用。
var api = (function())();api();
var api = (function();2).原型的模組化})();
我們對作用域、作用域提公升和閉包的工作方式深入了解後，引入模組之間的互動方式。
3).commonjs模組
這種模組化的好處在於: 變數沒有暴露在全域性作用域中，也不用把**放在閉包中。
瀏覽器原生並不支援cjs,使用browserify將模組編譯成瀏覽器能夠處理的形式。
使用cjs相對於原生的好處:
4).管理依賴
require(['lib/text'],function(text));說明：
按約定,lib/text對應的檔案路徑為lib/text.js,這是相對於本檔案的路徑。這段**會請求lib/text.js檔案解釋其中的**。載入完所有依賴後，呼叫這個模組中的函式，通過引數把依賴傳入到這個模組的函式中。
『lib/text』模組的定義如下:
define(,function()｛說明：return function(input)｛
return input.touppercase();
｝});
這個模組的定義使用了空陣列,因為它沒有依賴,返回的函式是模組的公共介面。
requirejs的優點:
requirejs的缺點:
發布優化的**，使用gulp編譯amd模組,就不用非同步獲取這些模組了。
5).browserify：在瀏覽器中使用cjs模組.
附加: 阮一峰的js模組編寫
模組化程式設計理解
工作中在做客戶運營系統時，發現js和css的引用還處於最原始的狀態沒有更新。在上乙個專案中通過物件和其中的方法實現了簡單的模組化程式設計。但隨著工程專案的龐大程度增加，簡單的物件已經滿足不了模組化程式設計的需求了，所以接觸了requirejs，了解了amd程式設計規範。和amd對應的是cmd,在no...
理解JS 模組化
module.exports與exports，export與export default之間的關係和區別 js 模組化規範 最早是閉包的寫法，防止變數的汙染 多個js 用 defer 和 async amd 和 cmd 在es6 module 出現之後就退出歷史的舞台了 es6 module 瀏覽器...
模組化的理解，以及模組化的好處
先理解模組 在程式設計中，為完成某一功能所需的一段程式或子程式 或指能由編譯程式 裝配程式等處理的獨立程式單位 或指大型軟體系統的一部分。可以這樣理解每乙個頁面中的部分都可以看成乙個模組。模組化是指解決乙個複雜問題時自頂向下逐層把系統劃分成若干模組的過程，有多種屬性，分別反映其內部特性。是指將每乙個...