ExtJs4新类库特性详解和JS新语法扩展.docVIP

ExtJs4新类库特性及JS新语法扩展 讲师：风舞烟 目录： ExtJS4对JS语法的扩展 JS动态引用加载 JS基本数据类型 定时事件执行 健盘导航事件 二、ExtJs4的新类库特性 Ext.define Configuration 配置 组合属性（mixins） 类的静态成员属性(statics) 概述： ExtJs4对JS基本语法的进行了新的扩展，包括动态加载、类的封装等 ExtJS 4的类系统（class system）进行了一次重大重构，ExtJS4的新架构就是基于这套新的类系统构建的，因此有必要先了解以下这个class systemI:最佳命名规范实践（其实是要求必须遵照它的规范） I: 解释健壮类系统的重要性 ExtJS 4 有300多个类，社区里有20w+不同背景的开发者，提供一个好的代码架构是个巨大的挑战： 易学，学习成本低 快速开发，容易调试和发布 组织良好，可扩展可维护 JavaScript是个基于原型链继承的语言，没有类的概念。而且JavaScript语言特点就是松散和自由，实现一个同样的功能，可以有很多种方式，但是如果放任它的松散和自由，就很难维护和重用代码。面向对象编程绝大部分都是基于类的。基于类的编程语言通常需要强类型，提供代码封装，并且有标准的编码习惯，ExtJS就是能做到既有面向对象编程的规范性，又能做到JavaScript的灵活性 II.命名规范 命名规范，使用一致的命名规范可以让你的代码结构清晰，可读性强。 1. Classes 类 类名只能包含字母数字，不推荐使用数字，除非是常用词。不要用下划线中化线等非字母数字字符。 MyCompany.useful_util.Debug_Toolbar?不合法 MyCompany.util.Base64?合法 类应该组织在包或者说命名空间下面，并且至少要有一个顶层命名空间，例如： MyCompany.data.CoolProxy MyCompany.Application 顶层命名空间和真正的类，应该采用驼峰式命名，其他一律小写，例如： MyCompany.form.action.AutoLoad 非Ext官方类，不可以在Ext顶层命名空间下（这是为了防止冲突）首字母组合词也要采用驼峰式命名，例如： Ext.data.JsonProxy?而不是?Ext.data.JSONProxy MyCompany.util.HtmlParser?而不是?MyCompary.parser.HTMLParser MyCompany.server.Http?而不是?MyCompany.server.HTTP 2. Source Files 源文件 类的命名和源文件存放路径是对应的，例如： Ext.util.Observable?存放在?path/to/src/Ext/util/Observable.js Ext.form.action.Submit?存放在?path/to/src/Ext/form/action/Submit.js MyCompany.chart.axis.Numeric?存放在path/to/src/MyCompany/chart/axis/Numeric.js 这里面的path/to/src就是程序跟目录下的那个app目录，所有类都应该这样组织，保证维护性 3.方法和成员变量 和类名一样只能用字母和数字，其他符号不可以 同样是驼峰命名，但是首字母小写，首字母组合词也如此 例如： 合法的方法名：encodeUsingMd5(),getHtml()代替getHTML(),getJsonResponse()代替getJSONResponse(),parseXmlContent()代替parseXMLContent() 合法的变量名：var isGoodName;,?var base64Encoder,?var xmlReader,?var httpServer 4. Properties 属性 跟成员变量一致 如果是常量 Ext.MessageBox.YES = Yes Ext.MessageBox.NO = No MyCompany.alien.Math.PI = 4.13 第一部分：ExtJS4对JS语法的扩展 一、动态引用加载 ExtJs4有庞大的类型库，很多类可能在当前的页面根本不会用到，我们可以引入动态加载的概念来即用即取。这些代码都要写在Ext.onReady外面。 动态引用外部Js //加载配置可用 Ext.Loader.setConfig({ enabled:true }); //动态引用“../ux/”目录下所有Js文件类，映射到对应命名空间 Ext.Loader.setPath(Ext.ux,../ux/); 动态加载类 //