介紹Ext JS 4 MVC給Web開發帶來的變化

文章最後將與大家一起討論作者在運用過程中碰到的問題以及解決辦法，並提出 MVC 需要進一步完善的地方。

Ext JS 4 目前是 Sencha 的產品，4.x 的正式版本號是 4.0.7。 Ext JS 4 供應商業版本，但如果您的專案是開源的，則可以HTTP://www.aliyun.com/zixun/aggregation/17944.html">免費使用 Ext JS 4。 Ext JS 的論壇目前非常活躍；Ext JS 還在不但地升級改進，據 Sencha 官方統計，使用 Ext JS 的開發者數目在一百萬以上。

Ext JS 4 與之前版本的比較

渲染效率提高

所有類都經過調優，包括最影響渲染效率的佈局引擎重寫。

命名空間

命名空間是 Ext JS 4 的 MVC 的基礎，自此 Ext JS 類能按作用域分開存放了。.NET 或 JAVA 開發者應該熟悉命名空間帶來的好處：命名空間讓全類名映射到類檔路徑變得很容易，將類按作用域分資料夾存放使得類更容易管理。 以 MVC 為例，Ext JS 類將按作用域：模型、視圖和控制器分為三類，分別存放于對應資料夾中。

按需載入類

清單 1. 按需載入類的例子

這個特性其實是基於全新設計的類系統的，詳見下面的小結。 不同于先前版本：即使用到 Ext JS 框架中很少一部分單元，Ext JS 也會載入所有的框架，按需載入只載入需要的類。 因此按需載入類為 JS 優化和減少記憶體消耗提供了一個有效途徑。 Sencha 為此還提供了 SDK 工具對 JS 代碼進行 Minify，在部署前運行 minify 對 JS 代碼最小化後，將得到一個最小 JS 集合。

全新的類系統 由於篇幅的限制，具體請參閱官方文檔 Class System，其中詳細描述了怎樣用 Ext JS 4 的方式定義類，以及錯誤處理和調試

MVC 架構 用 Ext JS 4 之前的版本寫大的用戶端應用，您會發現越來越「難」，您會發現有四難：難寫、難讀、難維護、難擴展。 隨著越來越多的功能添加進來，代碼越來越失控，一個 JS 檔幾千行可能很普遍了，當然也不排除代碼組織得很好易於擴展的情況，但這些都需要開發者付出額外的開發代價去組織自己的架構。 從 Ext JS 4 開始有了自己的 MVC 架構，開發者不必再付出這種額外的代價也能寫出漂亮的代碼。 Ext JS 4 對 MVC 有自己的定義，以下定義來自 Sencha 官網的文檔：

：一組欄位的集合以及它們對應的資料（例如：「User」類 model 有「username」和「password」欄位），通過 data 包 (store,proxy 等 )Model 能序列化自己，並能通過關聯關係從一個 Model 導航到另一個 Model。 Model 的工作原理類似 Ext JS 3 中的 Record 類，通常結合 Store 為表格控制項或其它控制項提供顯示資料。

：任意元件，如 Grid, Tree 和 Panel 都是視圖。

：在這裡寫所有的邏輯代碼：如渲染視圖、具現化模型、載入並初始化其它控制器等。

MVC 的概念很簡單，但實際專案中運用 MVC 模式將代碼組織起來會不會沒那麼簡單？ 答案在後面的章節「介紹開發 Ext JS4 的利器 : Sencha Architect 2」中，該章節會詳細介紹怎樣用該工具開發 MVC 模式的 Ext JS 程式。