一、Web MVC背景：
隨着web 前端的迅速發展，我們在瀏覽網頁時，隨處可見各種各樣複雜的界面，如瀏覽器主界面，出現的很多的a、span、li標籤等等，而且它們的內容是實時更改的，通過前端向服務器發送請求，後臺將請求數據發回給前端，通過解析，處理，最終呈現給用戶的；在界面運行狀態，服務器也有可能向前端發送數據等等。其中的複雜過程可想而知，代碼量也是很大，當這樣龐大的代碼量遇到優化，或者在更改需求的情況下，由於代碼之間的耦合度很高，聯繫緊密，要修改的甚至是重新編代碼代價實在是太大，所以MVC模塊化的思想在前端發展中顯得尤爲重要；將數據、控制、視圖分開，模塊化進行編寫，降低了代碼之間的聯繫，使得代碼在優化、修改中都是很容易進行的，爲企業在前端開發時節省了大量的人力，財力，同時在編碼效率上也得到了很大的提高。
二、Web MVC概念：
Model：就是處理與數據有關的內容，包括數據的存儲、查詢、更新等內容。
View:負責數據的展示，與用戶進行交互，就是我們平時看到的界面，html片段、,css、js模板，不包含任何的邏輯處理。
Controller:處理與事件有關的邏輯；是view和model聯繫的橋樑，當前端界面發送數據請求時，controller委託給model處理，然後將請求數據交給view從而呈現給用戶。
Web MVC致力於模塊分離，各幹各的事情，彼此之間不受影響，使得代碼之間的耦合度降低，有助於代碼的修改和優化。
圖2-1-1
在這裏再提到一個概念：命名空間，就是給一個對象添加屬性來管理一個空間，這個命名空間可以是一個對象也可以是一個函數；在函數下的命名空間我們很容易理解，如：函數中的局部變量在外部是不能調用的，但是給window增加的對象局部變量是可以訪問的；在對象中添加對象，方法，通過對象名來調用，避免命名衝突和模型中的方法和回調函數混在一起，也是符合MVC思想的。
三、Web MVC實例:
這裏我用一個視頻系統管理中的課程管理的過程演示一下web MVC和命名空間在實踐中的應用過程：
圖3-1-1
圖3-1-1的klass、year、month等用於存儲從服務器發送過來的所有課程管理界面需要的所有數據。展示的是當前正在進行的課程、無效的課程和全部課程信息在前端的存儲位置。
在圖中我們可以看到：在window.valid、window.all、window.invalid中的內容基本是一樣的，但是它們之間不會有任何的影響，這就是命名空間的優點。
這樣做的優點在於：減少了訪問服務器的次數，界面的加載和多次刷新速度都會很快，大大地提高了用戶體驗。
圖3-1-2
圖3-1-2是存儲用戶點擊分頁時，存儲當前界面的課程信息；當用戶再次點擊該頁面時便可直接在該對象中取出數據。
圖3-1-3
圖3-1-3起到一個調度員的作用，用於前端頁面數據查詢，在model中通過傳遞getKlass()這個回調函數作爲參數，在view中便可實現前端界面的多次刷新。
圖3-1-4
圖3-1-4是view中的界面楔入部分；通過一個util中實現各種工具，在通過將modal、navigation、tableSet、Carousel等模塊化，通過一個專門用來寫界面的model中的方法進行解析，再楔入數據，很快就實現一個界面，大大提高了界面編程。
圖3-1-5
圖3-1-5就是我上述提到的寫界面的model。對其中的數據進行解析，楔入內容就實現了moal,
Modal頭部固定，可通過多次楔入modalContent，實現modal的多次複用，減少了代碼量，提高了用戶對頁面請求時，頁面的加載速度。
圖3-1-6
圖3-1-6是controller中的事件觸發器的組成中的分頁頁面觸發部分。