3.define

1、定义类

define方法定义类
extend：用于继承
alias:类的别名
alternateClassName：备用名，与alias差不多
requires：需要使用到的类名数组，在动态加载时会根据该属性去下载类，注意需要的类是在当前类之前被加载
uses：与requires类似 但是被引用的类可以在该类之后才加载
constructor：构造器属性，一般用来初始化类的配置和调用其父类的方法
mixins：混入属性，多继承
config：定义类的配置项，会把config里的每个属性加上get和set方法
statics：定义静态方法，属性不能被子类继承
inheritableStatics：与statics类似，但是其属性可被子类继承
singleton：设置该类为单件模式

 实例：定义类

    Ext.define('Person',{
        config:{//config属性 就是配置当前类的属性内容,并且会加上get和set方法
            name:'start',
            age:10
        },
        say:function(){
            alert('我是方法...');
        },
        constructor:function(config){//构造器 初始化信息
//          for(var attr in config){
//                alert(attr + " : " + config[attr]);
//            }
            var me=this;
            me.initConfig(config);//初始化传递进来的参数
        }
    });

 

 实例：实例化对象

    //普通实例化对象
    var p=new Person();
    alert(p.getName());
    alert(p.getAge());
    //普通实例化对象
    var p=new Person({
        name:'wwl',
        age:80
    });
    alert(p.getName());
    alert(p.getAge());
    
    //Ext.create 实例化一个对象  推荐使用方式
    var p = Ext.create('Person',{
        name:'王五' , 
        age:30
    });
    alert(p.getName());
    alert(p.getAge());
    p.say();

 

 2、继承extend

    //Sup Class
    Ext.define('Person',{
        config:{
            name:'bjsxt'
        } ,
        constructor:function(config){
            var me = this ;
            me.initConfig(config);
        }
    });
    //Sub Class
    Ext.define('Boy',{
        //使用Ext的继承
        extend:'Person',
        config:{
            sex:'男',
            age:20
        }
    });
　　//实例化
    var b = Ext.create('Boy',{
        name:'张三',
        age:25
    });
    alert(b.name);
    alert(b.sex);
    alert(b.age);

 3、别名 使用原名一样

Ext.onReady(function(){
    Ext.define("User",{
        config:{
            name:'bjsxt111' , 
            age:100
        },
        alias:'uu' ,//起别名    底层代码在Ext.ClassManger
        alternateClassName:'uuu',    //给当前类一个备用名 底层代码在Ext.ClassManger
        constructor:function(config){
            var me = this;
            me.initConfig(config);
        }
    });
     
    var u = Ext.create('uuu');//一样 Ext.create('uu');
    alert(u.name);
    alert(u.age);

});

 

4、静态方法

statics(子类不能继承) inheritableStatics(子类可以继承)

实例对象是无法使用静态属性或方法的，用类名去使用静态属性

Ext.onReady(function(){

    Ext.define('Person',{
        config:{
            name:'我是父类'
        },
        statics:{    //静态的方法或属性
            static_id:'我是Person的id,不能被子类所继承!!'
        },
        inheritableStatics:{    //静态的方法或属性
            inheritableStatics_id:'我是Person的id,我可以被子类继承!!'
        },
        constructor:function(config){
            var me = this;
            me.initConfig(config);
        }
    });
    Ext.define('User',{
        extend:'Person' , 
        config:{
            age:20
        }
    });
    alert(User.static_id);//不可调用
    alert(User.inheritableStatics_id);
});

 

5、mixins 混合的配置项,可以多继承的配置

    Ext.define("Sing",{
        canSing:function(){
            alert('cansing...');
        }
    });
    Ext.define("Say",{
        canSay:function(){
            alert('cansay...');
        }
    });    
    Ext.define('User',{
        mixins:{
            sing:"Sing" , 
            say:"Say"
        }
    });
    
    var u = Ext.create("User");
    u.canSay();
    u.canSing();

 6、动态加载一个js文件

第一步：在js/extjs/添加文件夹 (ux)，在这个ux文件夹下 建立自己的组件所对应的js文件
第二步：在js/extjs/ux下编写自己的扩展的组件
第三步：启用ext动态加载的机制 并设置要加载的路径
第四步：创建类的实例并使用

组建定义

//define的类名，一点要严格按照包层次路径去编写
Ext.define('js.05danamic.ux.MyWindow',{
        extend:'Ext.window.Window' , //继承Ext的window类
        title:'我是动态加载进来的组件',
        height:300 , 
        width:400 ,
        constrain:true , 
        modal:true , 
        html:'我是窗体的内容!!!!' ,     
        renderTo:Ext.getBody()    
});

 

动态加载

    Ext.Loader.setConfig({
        enabled:true ,
        paths:{
            myux:'js.05danamic.ux'
        }
    });
　　第四步：创建类的实例并使用
    Ext.create('js.05danamic.ux.MyWindow').show();