[关闭]
@iamzealotwang 2014-08-26T04:18:12.000000Z 字数 8728 阅读 861

前端代码规范

代码规范

概览

类型 命名方式 例子
包名 驼峰方式,首字母小写 com.copyEngine.scene.sceneResize
类名 驼峰方式,首字母大写 PlayerProfileDialog.as
函数(判断类) 以is开头+函数的意义 isCanAddEachStep
函数(返回数据) 以get开头+函数意义 getMissionSubStepMetaByID
函数传参 以下划线开头
Private变量 首字母为m mUserInfoData
Protected变量 首字母为m mStarlingFactory
Array 写清楚Array中装的是什么+Array结尾 mAllUserInfoDataArray
Vector 写清楚Vector中装的是什么+Vector结尾 mAllUserInfoDataVector
Dictonary 写清楚Dictonary中装的什么+Dic结尾 mAllUserInfoDataDic

命名规范

包结构相关

包的命名方式

模块标准结构

对于一个标准的模块结构如下

ProfileDialog模块:

|-- profileDialog
|       |-- handle
|            |--    ProfileDialogDataHandleMediator.as
|            |--    ProfileDialogDataHandleNotification.as
|
|       |-- view
|            |--      data
|                       |-- ProfileDialogUserInfoData.as
|
|            |--    component
|                       |--     infoBar
|                                   |-- ProfileDialogInfoBarComponent.as
|                       |--     groupBtn
|                                   |-- ProfileDialogGroupBtnComponent.as
|
|       |--    ProfileDialog.as
|       |--    ProfileDialogPreset.as
|       |--    ProfileDialogConfig.as
|       |--    ProfileDialogDataHandleUtils.as
|       |--    PofileDialogRPCName.as

说明

类结构相关

类的命名方式

> 首字母 **大写** 驼峰方式
> `ScreenResizeManger.as`

模块入口类 (ProfileDialog.as)

  1. package app.dialog.userProfile
  2. {
  3.     public class ProfileDialog extends BasicSceneDialog
  4.     {
  5.         //所有内部变量(private & protected) 均需要以m开头(Member)
  6.         //名称为m+类名(去除前缀)--->m + UserInfo + Component
  7.         private var mUserInfoComponent:ProfileDialogUserInfoComponent;
  8.         private var mUserEditComponent:ProfileDialogUserEditComponent;
  9.         private var mInteractionButtonComponent:ProfileDialogIntercationButtonComponent;
  10.         private var mUserInfoData:ProfileDialogUserInfoData;
  12.         //Boolean值的命名以IsXXXX开头
  13.         private var mIsCanAdd:Boolean;
  14.         private var mIsCanVisit:Boolean;
  15.         private var mIsCanChat:Boolean;
  17.         //一个参数传入的变量以下划线开头,代码内部不再使用下划线
  18.         //参数名称为私有名称将m改为下划线
  19.         //mUserProfileVo----> _userProfileVo
  20.         public function UserProfileDialog(_userProfileVo:UserProfileVo, _isCanAdd:Boolean, _isCanVisit:Boolean, _isCanChat:Boolean)
  21.         {
  22.             mUserProfileVo = _userProfileVo;
  23.             mIsCanAdd = _isCanAdd;
  24.             mIsCanVisit = _isCanVisit;
  25.             mIsCanChat = _isCanChat;
  26.         }
  28.         //============================================//
  29.         //==Initialize&Dispose  Function
  30.         //============================================//
  32.         /*
  33.          * 无论 Dialog or Scene 初始化均 override doInitialize函数,该函数内
  34.          * 仅仅为了组织该模块中使用的组件,不进行具体的逻辑处理
  35.          */
  36.         override protected function doInitialize():void
  37.         {
  38.             mUserInfoData = new ProfileDialogUserInfoData();
  40.             mUserInfoComponent = new ProfileDialogUserInfoComponent(mUserInfoData);
  42.             //将Component注册进来及可完成相应的初始化
  43.             registerUIComponent(mUserInfoComponent);
  45.             mUserEditComponent = new ProfileDialogUserEditComponent(this, mUserInfoData);
  46.             registerUIComponent(mUserCanEditComponent);
  48.             ...
  49.         }
  52.         /*
  53.          * 无论 Dialog or Scene 退出时候均 override doDispose函数,该函数内
  54.          * 无需对已经注册的Component进行Dispose
  55.          * 比如 mUserEditComponent&&mUserEditComponent.dispose() 这样是不必要的
  56.          * (写了也不会报错)
  57.          */
  58.         override protected function doDispose():void{}
  60.         /*
  61.          * 如果需要在Component都初始化后执行某些操作 需要override该函数
  62.          * 注意Component内部的onAddToStage函数会比Dialog or Scene的先执行
  63.          */
  64.         override protected function onAddToStage():void  {...}
  66.         //============================================//
  67.         //==Public Interface  Function
  68.         //============================================//
  70.         /*
  71.          * 在Dialog or Scene存在的Public方法均为onClickXXXX系列,及由每个Component回调Manger
  72.          * 执行相关的Logic
  73.          */ 
  74.         public function onClickSaveBtnHandle():void
  75.         {
  76.             onClickComponentToEditForRefresh(false);
  77.             ProfileDialogDataHandleUtils.editUserProfileInfo(mUserSharedData);
  78.             MissionHandleUtils.gameMissionAddProgressFromEditProfile();
  79.         }
  81.         public function onClickComponentToEditForRefresh(_currentIsEdit:Boolean):void  {...}
  83.         //============================================//
  84.         //==OverrideAble  Function
  85.         //============================================//
  87.         /*
  88.          * 返回当前 Dialog or Scene 的素材类 如果不override该函数则建立空场景
  89.          */
  90.         override protected function createUIContainerSymbolMeta():CESDisplayObjectMeta  
  91.         { 
  92.             return mResProxy.getGUIMeta(GUIName.FILE_PROFILE_DIALOG, "UserProfileDialog"); 
  93.         }
  95.         /*
  96.          * 如果当前模块需要监听某个Notification需要override该方法
  97.          * 该方法需要返回一个Array,Array中每一项均是一个Array
  98.          * 每一项的[0] 为需要监听的Notification
  99.          * 每一项的[1] 为对该Notification的处理函数
  100.          *
  101.          * 在Dispose时候引擎层会自动帮助取消监听,Logic不需要再Dispose函数中手动处理监听移除
  102.          */
  103.         override protected function getListNotification():Array
  104.         {
  105.             return [
  106.                 [XXXXXNotification.UI_XXXX_VO_CHANGE,onReceiveXXXVoChange]
  107.             ];
  108.         }
  110.     }
  111. }

模块Component类 (ProfileDialogInfoBarComponent.as)

  1. package app.dialog.userProfile.sub
  2. {
  4.     public class ProfileDialogUserEditComponent extends CESceneUIComponentBasic
  5.     {
  6.         //每个模块内部对Component的引用类全都用mManger
  7.         private var mManager:UserProfileDialog;
  8.         private var mUserInfoData:ProfileDialogUserInfoData;
  10.         private var mEditUserLearnYearMc:DisplayObject;
  11.         private var mEditUserLearnYearTF:CESUITextfield;
  12.         ...
  15.         public function ProfileDialogUserEditComponent(_manager:UserProfileDialog, _userInfoData:UserProfileDialogShardData)
  16.         {
  17.             mManager = _manager;
  18.             mUserInfoData = _userInfoData;
  19.         }
  21.         //============================================//
  22.         //==Initialize&Dispose  Function
  23.         //============================================//
  25.         /*
  26.          * 每个Component在 doInitialize函数内部 调用DoubleCallFunction去取得相应的组件
  27.          */
  28.         override protected function doInitialize():void
  29.         {
  30.             mRootRegisterHelper.registerDoubleCallFun(function():void
  31.             {
  32.                 mEditUserLearnYearMc = mRootRegisterHelper.getDisplayTreeMc('root[xx]');
  33.                 mEditUserLearnYearTF = mRootRegisterHelper.getDisplayTreeMc('root[xx][xx]');
  34.             });
  35.         }
  37.         /*
  38.          * 在 doOnAddToStage 函数内部执行组件的初始化逻辑
  39.          * (不可以在doInitialize中执行初始化操作)
  40.          */
  41.         override protected function doOnAddToStage():void
  42.         {
  43.             mEditUserLearnYearMc.visible = mUserInfoData.userID == GlobalConst.PLAYER_ID;
  44.             mNormalUserLearnYearMc.visible = mUserInfoData.userID != GlobalConst.PLAYER_ID;
  46.             mEditUserAboutMeMc.visible = mUserInfoData.userID == GlobalConst.PLAYER_ID;
  47.             mNormalUserAboutMeMc.visible = mUserInfoData.userID != GlobalConst.PLAYER_ID;
  49.             ...
  51.             refreshDisplay();
  52.         }
  55.         /*
  56.          * 不需要对从DoubleCall取出的Mc进行dispose操作
  57.          * 比如 mEditUserLearnYearBtn && mEditUserLearnYearBtn.dispose() 这种操作是
  58.          * 没有必要的(但是不会报错)
  59.          */
  60.         override protected function doDispose():void
  61.         {
  62.         }
  64.         //============================================//
  65.         //==Public Interface  Function
  66.         //============================================//
  68.         /*
  69.          * Component在80%情况下仅仅需要提供 refreshDisplay 方法即可,所有的数据更改操作 均在
  70.          * mManger中执行(如果为viewData更改 mManger内部处理,如果为vo层更改则通过DataHandel)
  71.          * 处理，处理结束后回调相应Component的 refreshDisplay方法
  72.          */
  73.         public function refreshDisplay():void
  74.         {
  75.             mEditUserLearnTearTF.text = '' + mUserInfoData.learnYear;
  76.             mNormalUserLearnYearTF.text = '' + mUserInfoData.learnYear;
  78.             mEditUserAboutMeTF.text = '' + mUserInfoData.userAboutMeInfo;
  79.             mNormalUserAboutMeTF.text = '' + mUserInfoData.userAboutMeInfo;
  81.             //常量均要定义在模块的Config文件(ProfileDialogConfig)中
  82.             mEditUserLearnYearMinusBtn.enabled = int(mEditUserLearnTearTF.text) > ProfileDialogConfig.USER_MIN_AGE_NUM;
  83.             mEditUserLearnYearAddBtn.enabled = int(mEditUserLearnTearTF.text) < ProfileDialogConfig.UER_MAX_AGE_NUM;
  84.         }
  87.         //========================//
  88.         //==Private  Function
  89.         //=========================//
  91.         /*
  92.          * Componet内部的Event处理函数均以onClickXXXXBtn 或 onClickXXXXListCellRender 等命名
  93.          * !!注意 在onClick事件中仅仅是对事件的一次封装,将点击事件原封不动交给Manger处理
  94.          * 不可以在此处执行任何的数据处理
  95.          * 不可以执行 mUserInfoData.learnYear++ 这种操作
  96.          */
  97.         private function onClickAddUserLearnYearBtn():void
  98.         {
  99.             mManager.onClickAddUserLearnYearBtn();
  100.         }
  102.         private function onClickSubUserLearnYearBtn():void
  103.         {
  104.             mManager.onClickAddUserLearnYearBtn();
  105.         }
  108.     }
  109. }

模块DataHandelMediator类 (ProfileDialogDataHandleMediator.as)

  2. package data.handle.playerProfile
  3. {
  4.     public final class ProfileDialogDataHandleMediator implements IDataHandleMediator
  5.     {
  6.         public function ProfileDialogDataHandleMediator()
  7.         {
  8.         }
  10.         /*
  11.          * 在onRegister函数内部 注册当前Mediator需要监听的所有消息
  12.          */
  13.         public function onRegister():void
  14.         {
  15.             CENotificationFacade.instance.register(ProfileDialogDataHandleNotification.HANDLE_CHANGE_PLAYER_PROFILE, onHandleChangePlayerProfile);
  17.             ...
  18.         }
  20.         private function onHandleChangePlayerProfile(_arg:Object):void
  21.         {
  22.             var playerProfileVo:PlayerProfileVo=PlayerProfileVoProxy.instance.playerProfileVo;          
  23.             //执行数据逻辑相关的操作
  24.             ...
  26.             //发送RPC通知服务器改变
  27.             CERpcManger.instance.addRpcCommand(CERpcConfig.RPC_TYPE_IMMEDIATELY,
  28.                                 PofileDialogRPCName.COMMAND_CHANGE_PLAYER_PROFILE,
  29.                                     {
  30.                                         vo: playerProfileVo
  31.                                     });
  33.             //通知UI层
  34.             CENotificationFacade.instance.sendNotification(CommonPlayProfilVoHandleNotification.UI_PLAYER_PROFILE_VO_CHANGE);
  35.             }
  36.         }
  38.     }
  39. }

关于简写

简写 全称 例子
Bg BackGround homeBg
Mc DisplayObject flagMc
Btn Button okBtn
TF TextFiled mMegTF
Dic Dictonary mAllMetaMissionDic
Obj Object mMissionJsonObj

- 特别注意
- 不允许 简写

Array Arr arr
Vector Vec

动态类 DynamicObject

只有在极少数情况下会出现需要使用动态类情况:

其他时候应该极力避免使用动态类,如果必须要使用，对于去内部属性也要有区分
需要采用mMissionJsonObj["xxx"] 这种方式取属性,不可以直接 mMissionJsonObj.xxx 取属性

添加新批注
在作者公开此批注前，只有你和作者可见。
回复批注