Ext.js学习笔记【3】

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

如何创建一个Ext的类、

创建类的复杂流程

Ext.js和Ext-more.js深入解析

Ext对原生javascript类的扩展

动态加载机制

Ext操作Dom

Ext开始响应事件

• 定义类的方法：define

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

Ext.define(classname,properties,callback);

classname:要定义的新类的类名

properties：新类的配置对象

callback：回调函数，

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

Ext.Class类

configs:

extend：用于继承

alias:类的别名

alternateClassName：备用名，与alias差不多

requires：需要使用到的类名数组，在动态加载时会根据该属性去下载类，注意需要的类是在当前类之前被加载

uses：与requires类似 但是被引用的类可以在该类之后才加载

constructor：构造器属性，一般用来初始化类的配置和调用其父类的方法

mixins：混入属性，多继承

config：定义类的配置项，会把config里的每个属性加上get和set方法

statics：定义静态方法，属性不能被子类继承

inheritableStatics：与statics类似，但是其属性可被子类继承

singleton：设置该类为单件模式

Ext.onReady(function(){
    //在Ext中如何去定义一个类: Ext.define(className , properties , callback)
    Ext.define('Person',{
        //这里是对于这个类的一些配置信息
        //config属性 就是配置当前类的属性内容,并且会加上get和set方法
        config:{
            name:'z3' , 
            age: 20
        },
        //自己定义的方法
        say:function(){
            alert('我是方法...');
        },
        //给当前定义的类加一个构造器 ,目的就是为了初始化信息
        constructor:function(config){
            var me = this ;
//            for(var attr in config){
//                alert(attr + " : " + config[attr]);
//            }
            me.initConfig(config);    // 真正的初始化传递进来的参数
        }
    });
    
    var p=new Person();

        
    //Ext.create 实例化一个对象
    var p = Ext.create('Person',{
        name:'王五' , 
        age:30
    });
    alert(p.getName());
    alert(p.getAge());
    p.say();
)};
    

 

 

---

 

• extend：用于继承