Ext JS学习第六天 Ext自定义类（一）

浏览数：35 / 时间：2015年06月09日

此文来记录学习笔记

•我们在之前的学习，已经对ExtJS有了一个初步的认识，那么如果要学好ExtJS，对于javascript是必须的，也就是说，对于理解ExtJS底层基础架构的理解也是必须的。那么我们现在就开始学习ExtJS的基础架构。

–如何创建一个Ext的类、创建类的复杂流程

•定义类的方法：define

•对于Ext4.X版本来说，采用了新定义类的define方法，而不是延续旧版本的extend方法，那么对于定义一个新的类。我们来了解下define的使用。

•Ext.define(classname,properties,callback);

–classname:要定义的新类的类名

–properties：新类的配置对象

–callback：回调函数，当类创建完后执行该函数

•对于Ext定义一个新的类，那么我们可以想象到，既然是利用Ext.define去创建类，那么创建的类一定是Ext所特有的类，不同于传统的javascript创建一个类，也就是说我们要对于define方法的第二个参数properties配置项进行配置，需要找到Ext对于类支持的API并进行配置

好了，依照惯例该到举栗子的时候了，请看栗子代码

 1 Ext.onReady(function () {
 2     //config 、constructor 构造器
 3     
 4     //在Ext中如何去定义一个类: Ext.define(className , properties , callback)
 5     Ext.define(‘Person‘,{
 6     //这里是对于这个类的一些配置信息
 7     //config属性 就是配置当前类的属性内容,并且会加上get和set方法
 8     config:{
 9         name:‘z3‘ , 
10         age: 20
11     },
12     //自己定义的方法
13     say:function(){
14         alert(‘我是方法...‘);
15     },
16     //给当前定义的类加一个构造器 ,目的就是为了初始化信息
17     constructor:function(config){
18         var me = this ;
19         me.initConfig(config);    // 真正的初始化传递进来的参数
20     }
21     });
22     
23     //Ext.create 实例化一个对象
24     var p = Ext.create(‘Person‘,{
25     name:‘王五‘ , 
26     age:30
27     });
28     alert(p.getName());//王五
29     alert(p.getAge());//30
30     p.say(); //我是方法...
31     
32 })