?

準(zhǔn)則： ?一致性， 隔離與統(tǒng)一管理， 螺旋式重構(gòu)改進， 消除重復(fù)， 借鑒現(xiàn)有方案

1.????保證系統(tǒng)實現(xiàn)的一致性，尋求一致性方案， 相同或相似功能盡量用統(tǒng)一模式處理；

2.????盡可能使用隔離技術(shù)，將某一模塊（比如權(quán)限管理）的代碼隔離在局部統(tǒng)一管理；

3.????不斷重構(gòu)改進，一旦發(fā)現(xiàn)更好的方式， 馬上替換掉原有方式；

4.????盡可能重用，消除重復(fù)；

5.????盡可能先借鑒系統(tǒng)中已有方案并復(fù)用之；如果有更好方案可替換之；

?

前端架構(gòu)： 采用MVC模式

1.?????盡可能遵循MVC模式， 做到 “模型-視圖-控制器”相分離；

2.?????將整個MVC應(yīng)用分解為多個小的MVC應(yīng)用， 模塊化管理；

3.????“模型-視圖”分離： 顯示數(shù)據(jù)集時， 先定義數(shù)據(jù)模型， 再定義 Store ， 然后關(guān)聯(lián)到具體的視圖中引用；

4.????“視圖-控制器”分離： 視圖事件邏輯放置于控制器中，控制器負責(zé)注冊事件監(jiān)聽、數(shù)據(jù)加載及更新視圖； 極少量邏輯可以綁定到視圖中。

?

組件配置： 標(biāo)識 – 數(shù)據(jù)配置– 布局 – 顯示 – 樣式– 監(jiān)聽器

1.????唯一標(biāo)識性(xtype/itemId/name)最先，數(shù)據(jù)配置信息(store)次之，布局信息(layout, flex)再次之， 顯示性信息(width,height, text等)再次之，樣式信息(margin等)再次之，操作/事件監(jiān)聽器(handler, listeners)最后。

2.????標(biāo)識性信息用于定位組件；數(shù)據(jù)配置信息用于更快速地了解其顯示用途；

3.????事件監(jiān)聽器最好在控制器中注冊。

?

異步請求的操作與響應(yīng)： 統(tǒng)一模式， 響應(yīng)信息盡可能明確詳細 ， 正確優(yōu)先于效率

1.????創(chuàng)造和使用統(tǒng)一模式處理異步請求: 發(fā)送請求、處理響應(yīng)、給予提示；

2.????每個異步請求的響應(yīng)提示必須指明該響應(yīng)針對什么請求，完成了什么操作，產(chǎn)生了什么影響； 如果成功， 顯示成功導(dǎo)致的結(jié)果； 如果失敗，顯示具體原因； 必要的話給予建議操作;

3. ? ?正確性是第一位的， 其次是效率； 錯誤的高效只會導(dǎo)致更災(zāi)難的結(jié)果，而低效的正確毫無意義；

4.????異步請求可以使用兩種方式： Ext.data.Store.load 方法和 Ext.Ajax.request . 前者用于為綁定store 的組件加載數(shù)據(jù)， 后者用于請求操作。

?

全局變量管理：

1.????使用單例模式；

2.????所有模塊公用的全局變量和函數(shù)放在文件 sharedUtils.js 和 sharedComponents.js 中統(tǒng)一管理；?sharedUtils.js 管理實用工具類， sharedComponents.js 管理組件的常用配置；

3.????特定模塊公用的全局變量和函數(shù)放在該模塊的 XXXUtils.js 文件中， 例如 VmoperationUtils.js

?

命名規(guī)范：

1.?????程序中的所有變量一律采用駝峰式寫法；而組件配置中的標(biāo)識性變量 itemId, name 等值采用下劃線寫法。比如，

? ? ? ? ?var vmName =parent.down(‘textfield[name=”vm_name”]’);

2.????模塊名帶有 _module 或 Module 后綴， 以便于區(qū)分；

?

文件位置約定：

1.????自定義樣式放置于webapp/resources/css/moonmm.css 下；

2.????圖片放置于webapp/resources/images/ 下；

3.????特定模塊的局部 frame html 文件放置于 webapp/framehtml/下；

4.????公用JS庫、文件放置于 webapp/ 下

?

應(yīng)用目錄結(jié)構(gòu)：

1. ? ?整體MVC 目錄結(jié)構(gòu)： 分解為多個子MVC應(yīng)用

? ? ? ? ? ? ?

? ? ? ? ? ? ?2. ?每個子MVC 應(yīng)用的目錄結(jié)構(gòu)：

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?

? ? ? ? ? ? ? ? ?

? ? ? ? ?

轉(zhuǎn)載于:https://www.cnblogs.com/lovesqcc/p/4037751.html

總結(jié)

以上是生活随笔為你收集整理的Extjs4前端开发代码规范参考的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。