Extjs4前端开发代码规范参考

 


准则:  一致性, 隔离与统一管理, 螺旋式重构改进, 消除重复, 借鉴现有方案

1.    保证系统实现的一致性,寻求一致性方案, 相同或相似功能尽量用统一模式处理;

2.    尽可能使用隔离技术,将某一模块(比如权限管理)的代码隔离在局部统一管理;

3.    不断重构改进,一旦发现更好的方式, 马上替换掉原有方式;

4.    尽可能重用,消除重复;

5.    尽可能先借鉴系统中已有方案并复用之;如果有更好方案可替换之;

 

前端架构: 采用MVC模式

1.     尽可能遵循MVC模式, 做到 “模型-视图-控制器”相分离;

2.     将整个MVC应用分解为多个小的MVC应用, 模块化管理;

3.    “模型-视图”分离: 显示数据集时, 先定义数据模型, 再定义 Store , 然后关联到具体的视图中引用;

4.    “视图-控制器”分离: 视图事件逻辑放置于控制器中,控制器负责注册事件监听、数据加载及更新视图; 极少量逻辑可以绑定到视图中。

 

组件配置: 标识 – 数据配置– 布局 – 显示 – 样式– 监听器

1.    唯一标识性(xtype/itemId/name)最先,数据配置信息(store)次之,布局信息(layout, flex)再次之, 显示性信息(width,height, text等)再次之,样式信息(margin等)再次之,操作/事件监听器(handler, listeners)最后。

2.    标识性信息用于定位组件;数据配置信息用于更快速地了解其显示用途;

3.    事件监听器最好在控制器中注册。

 

异步请求的操作与响应: 统一模式, 响应信息尽可能明确详细 , 正确优先于效率

1.    创造和使用统一模式处理异步请求: 发送请求、处理响应、给予提示;

2.    每个异步请求的响应提示必须指明该响应针对什么请求,完成了什么操作,产生了什么影响; 如果成功, 显示成功导致的结果; 如果失败,显示具体原因; 必要的话给予建议操作;

3.    正确性是第一位的, 其次是效率; 错误的高效只会导致更灾难的结果,而低效的正确毫无意义;

4.    异步请求可以使用两种方式: Ext.data.Store.load 方法和 Ext.Ajax.request . 前者用于为绑定store 的组件加载数据, 后者用于请求操作。

 

全局变量管理:

1.    使用单例模式;

2.    所有模块公用的全局变量和函数放在文件 sharedUtils.js 和 sharedComponents.js 中统一管理; sharedUtils.js 管理实用工具类, sharedComponents.js 管理组件的常用配置;

3.    特定模块公用的全局变量和函数放在该模块的 XXXUtils.js 文件中, 例如 VmoperationUtils.js

 

命名规范:

1.     程序中的所有变量一律采用驼峰式写法;而组件配置中的标识性变量 itemId, name 等值采用下划线写法。比如,

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

2.    模块名带有 _module 或 Module 后缀, 以便于区分;

 

文件位置约定:

1.    自定义样式放置于webapp/resources/css/moonmm.css 下;

2.    图片放置于webapp/resources/images/ 下;

3.    特定模块的局部 frame html 文件放置于 webapp/framehtml/下;

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

 

应用目录结构:

1.    整体MVC 目录结构: 分解为多个子MVC应用

             


             2.  每个子MVC 应用的目录结构:

                                         

                 

         

转载于:https://www.cnblogs.com/lovesqcc/p/4037751.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/493970.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数据结构之最小生成树

prime算法 普里姆(Prim)算法,是用来求加权连通图的最小生成树的算法。 基本思想 对于图G而言,V是所有顶点的集合;现在,设置两个新的集合U和T,其中U用于存放G的最小生成树中的顶点,T存放G的最小生成树中…

打造无所不及的智能:徐直军发布华为AI战略及全栈全场景方案

来源:C114通信网摘要:选择正确的问题比寻找新奇的方案更重要。“这是一个伟大的时代,华为立志为推动人类进步和世界繁荣做出贡献。2017年底,我们提出了新的愿景和使命,‘把数字世界带入每个人、每个家庭、每个组织&…

同步博客到CSDN

经过一些朋友的多次邀请,现同步博客到CSDN,地址:http://blog.csdn.net/knightswarrior。 转载于:https://www.cnblogs.com/KnightsWarrior/p/BackupToCSDN.html

四超多强 一文看懂中国CV独角兽格局

来源:网易智能通过短短两三年的攻城略地,中国CV(Computer Vision,计算机视觉)行业形成“四超多强”的格局。商汤、云从、依图、旷视还被称为“四小龙”,他们之间的故事由来已久,谈及最多的当属他…

数据结构之拓扑排序

拓扑排序介绍 拓扑排序(Topological Order)是指,将一个有向无环图(Directed Acyclic Graph简称DAG)进行排序进而得到一个有序的线性序列。 这样说,可能理解起来比较抽象。下面通过简单的例子进行说明! 例如,一个项目包括A、B、…

http://www.shengshiyouxi.com

android从Linux系统启动有4个步骤; (1) init进程启动 (2) Native服务启动 (3) System Server,Android服务启动 (4) Home启动 总体启动框架图如: 第一步:initial进程(system\core\init) init进程&…

清华 Aminer 发布最新2018人脸识别研究报告

来源:专知AMiner平台由清华大学计算机系研发,拥有我国完全自主知识产权。平台包含了超过2.3亿学术论文/专利和1.36亿学者的科技图谱,提供学者评价、专家发现、智能指派、学术地图等科技情报专业化服务。 今日,该平台发布最新的201…

数据结构之字典序全排列

字典序法中,对于数字1、2、3……n的排列,不同排列的先后关系是从左到右逐个比较对应的数字的先后来决定的。例如对于5个数字的排列 12354和12345,排列12345在前,排列12354在后。按照这样的规定,5个数字的所有的排列中最…

敏捷实践:比每日会议更疯狂的半日会议!

由“每周例会”说起 每天项目例会的话,频率太高了,可能会浪费时间,如果每月一次,似乎时间太长了,于是我们往往会“每周例会”。 有一次我参加了某项目的每周例会,开会的时间是周五,会上其中一位…

智能生产的现状与未来!

来源:数字化企业北京机械工业自动化研究所首席专家蒋明炜先生是我国最早投身企业管理及其信息化事业的专家之一,积累了宝贵的理论实践经验,在国家提出《中国制造2025》之后,蒋明炜先生作为该领域资深专家,先后组织领导…

琐碎知识

在c/c中,内存分成5个区,他们分别是堆、栈、自由存储区、全局/静态存储区和常量存储区。栈:就是那些由编译器在需要的时候分配,在不需要的时候自动清除的变量的存储区。里面的变量通常是局部变量、函数参数等。堆:就是那…

82岁的北大教授证明了黎曼猜想?

来源:AI科技大本营最近,黎曼猜想有点热。上个月,89 岁的菲尔兹奖与阿贝尔奖双料得主、英国皇家学会院士迈克尔阿蒂亚爵士(Michael Atiyah)刚刚宣布自己证明了黎曼猜想。近日,82 岁的北大教授(已…

Atlas机器人再秀逆天操作!波士顿动力科研or商业化,将何去何从?

来源:物联网智库在众多机器人相关的技术公司里,波士顿动力的核心特点在于,他们始终将「仿生」看作机器人设计的最高宗旨。其创始人Raibert 也称自己的目的是建造一种能和动物以及人一模一样的,完成一切事情的机器人。这既是波士顿…

OpenGL6-纹理动画

代码下载 #include "CELLWinApp.hpp"#include <gl/GLU.h>#include <assert.h>#include <math.h>#pragma comment(lib,"opengl32.lib")#pragma comment(lib,"glu32.lib")#pragma comment(lib,"winmm.lib") /*** 这个…

《科学美国人》:美国应保持太空、网络、生物领域的科技优势

来源&#xff1a;美国《科学美国人》转自&#xff1a;国防科技要闻&#xff08;ID&#xff1a;CDSTIC&#xff09;作者&#xff1a;军事科学院军事科学信息研究中心 吴海近日&#xff0c;美国《科学美国人》杂志发表《我们准备好迎接未来战争了吗&#xff1f;》一文&#xff…

hdu 4502 一维dp

吉哥系列故事——临时工计划 Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 65535/32768 K (Java/Others) Total Submission(s): 2159 Accepted Submission(s): 807 Problem Description俗话说一分钱难倒英雄汉&#xff0c;高中几年下来&#xff0c;吉哥已经深…

微信开发入门

微信开发需要搭建PHP环境 参考链接&#xff1a;Apache2.2与php5.3.5如何整合&#xff1f;如何能够被使用_百度经验 搭建的过程出现了很多坑&#xff0c;只能小心&#xff0c;重复搭建了&#xff0c;错误原因可能是VC9或VC11环境没有配置的原因&#xff0c;多试试才行。 然后…

实现计算机界“大满贯”,芮勇博士再获技术成就大奖

来源&#xff1a;联想研究院近日&#xff0c;国际计算机协会&#xff08;ACM&#xff09;多媒体专委会&#xff08;Special Interest Group on Multimedia&#xff0c;简称SIGMM&#xff09;2018技术成就奖揭晓了。在全球众多的候选人当中&#xff0c;该奖最终花落联想集团首席…

PHP之MVC学习

代码架构进货过程 one&#xff0c;混编 嵌入式脚本语言PHP html与php混编的编码方式 two&#xff0c;显示和逻辑相分离 最后&#xff0c;需要将显示和逻辑的结果放在一起&#xff01; 需要在 php页面&#xff0c;将html代码 载入才可以&#xff01; <?php // 业务…

机器人流程自动化崛起,中国是否准备好迎接智能自动化时代?

来源&#xff1a;亿欧智库摘要&#xff1a;机器人流程自动化&#xff08;Robotic Process Automation, RPA&#xff09;正迅速成为企业改善服务、提高效率和降低成本的关键工具。对此&#xff0c;PWC针对国内RPA市场展开了调查&#xff0c;预计未来45%的工作活动可以实现自动化…