Ext JS 4.0编码规范
Ext JS 4.0 Conventions
编者:王宁 Smiles Van
目录
Ext JS 4.0编码规范 (1)
Ext JS 4.0 Conventions (1)
1. 环境Requirements (2)
1) 浏览器Web Browsers (2)
2) 服务器Web Servers (2)
2. 目录结构Application Structure (2)
1) 基础路径Base Path (2)
2) 开发目录结构Dir Structure for Development (2)
3) 页面引用类库Reference to Ext JS Library (3)
3. 命名规范Naming Conventions (4)
1) 类系统Class System (4)
2) 命名规范Naming Conventions (4)
4. 实践Hands‐on (6)
1. 声明Declaration (6)
2. 配置Configuration (7)
3. 静态成员Statics (8)
4. 错误处理和调试Error Handling & Debugging (8)
5. 参考 (9)
1.环境Requirements
1)浏览器Web Browsers
●支持主流浏览器
●最佳调试浏览器列表:
⏹Google Chrome 10+
⏹Apple Safari 5+
⏹Mozilla Firefox 4+ with the Firebug
2)服务器Web Servers
●主流HTTP Server
2.目录结构Application Structure
1)基础路径Base Path
/
dir/to/js/extjs根据项目指定,J2EE Web工程一般在webapp目录建立相关静态文件目录,例如:
●projectname/src/main/webapp/static/
●projectname/src/main/webapp/js/
等。
2)开发目录结构Dir Structure for Development
/dir/to/js/extjs/app【应用目录,包含MVC子目录】
/dir/to/js/extjs/app/controller
/dir/to/js/extjs/app/model
/dir/to/js/extjs/app/store
/dir/to/js/extjs/app/view
/dir/to/js/extjs/ext‐4.0.x【Ext JS SDK独立存放,并裁剪相关目录和文件如下】
/
dir/to/js/extjs/ext‐4.0.x/locale【只存放需要的“本地化”文件】
/dir/to/js/extjs/ext‐4.0.x/resources【Ext JS SDK默认静态资源】
/dir/to/js/extjs/ext‐4.0.x/src【Ext JS SDK源代码,供ext.js、ext‐debug.js动态加载类使用】 /dir/to/js/extjs/ext‐4.0.x/bootstrap.js【Ext JS库加载文件,*推荐使用】
/dir/to/js/extjs/ext‐4.0.x/ext‐debug.js【动态加载类,开发调试用】
/dir/to/js/extjs/ext‐4.0.x/ext.js【动态加载类,生产用,*浏览器会产生很多网络连接】
/dir/to/js/extjs/ext ‐4.0.x/ext ‐all ‐debug.js 【压缩版ExtJS 库,开发调试用,*推荐ext ‐debug.js 】 /dir/to/js/extjs/ext ‐4.0.x/ext ‐all.js 【压缩版ExtJS 库,生产用,*推荐用JSBuilder 自定义】 /dir/to/js/extjs/resources 【自定义静态资源,只存放需要的.css 、图片等文件】
/dir/to/js/extjs/ux 【Ext  JS 扩展库,只存放需要的.js 文件】
/dir/to/js/extjs/app.js 【应用逻辑】
3) 页面引用类库Reference  to  Ext  JS  Library
● 开发用,静态文件与应用部署在一个服务器时:
其中:
⏹ “/static ”为“基础路径”在服务器的URI ;
⏹ 推荐使用bootstrap.js 引用Ext  JS 类库。
● 开发用,静态文件与应用部署在不同服务器时:
其中:
⏹ “domain/static ”为“基础路径”在静态服务器的URI ;
⏹ 推荐使用bootstrap.js 引用Ext  JS 类库。
3. 命名规范Naming  Conventions
1) 类系统Class  System
⏹ 包含300多个类
⏹ 由于JavaScript 是一种基于对象Object ‐Based 、面向原型Prototype ‐Oriented 语言,所以Ext  JS  4.0构建了通用代码架构Common  code  architecture ,此架构具有: ⏹ 简单易学familiar  and  simple  to  learn
⏹ 开发快速、调试简单、无痛部署fast  to  develop, easy  to  debug, painless  to  deploy  ⏹ 设计良好、易扩展、易维护well ‐organized, extensible  and  maintainable
2) 命名规范Naming  Conventions
● 类Classes
⏹ 类名仅可包含字母、数字。数字大多数情况下不推荐使用,除非是在一些技术术语中。不要使用中划线、下划线等非字符:
⏹ 类应该通过正确命名的“包(Packages )”来组织。最小包情况时,类名应该紧随
最顶层的“名字空间(Namespace )”:
⏹ 最顶层的“名字空间(Namespaces )”和“类名(Class  Names )”应该使用“驼峰
命名法(CamelCased )”,其他都是用小写字母:
js arguments
非Sencha 官方发布的类,不要使用“Ext ”作为最顶层名字空间。
⏹ 缩写词也要遵守“驼峰命名法(CamelCased )”:
● 源文件Source  Files
⏹ 类名直接映射到文件存储路径,每个类一个文件:
“path/to/src ”是“应用(Application )”所在的目录(即包含app 、ext 的应用目录)。类应该在此“根目录(Root )”下通过“名字空间(Namespace )”组织起来,通过最佳实践去开发、维护和部署。
● 方法和变量Methods  and  Variables
⏹ 方法和变量命名同类一样,仅可包含字母、数字。数字大多数情况下不推荐使用,
除非是在一些技术术语中。不要使用中划线、下划线等非字符;
⏹ 方法和变量命名应该使用“驼峰命名法(CamelCased )”,缩写词也一样;
● 属性Properties
⏹ 非静态的类属性命名规则同上;
⏹ 静态的类属性命名全部使用大写字母:
4. 实践Hands ‐on
1) 声明Declaration
● 旧方法
● 新方法
Ext  JS  4使用单一方法:Ext.define 。
⏹ className :类名;
⏹ members :通过键值对(Key ‐value  pairs )构成的对象(Object )来表示类成员(Class
Members )的集合;
⏹ onClassCreated :回调函数,可选。此函数当所有类依赖准备完毕、类自身已经全
部创建时会被调用。
示例:

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。