extjs-oop

1、extjs本身就有面向对象的特性,本人写的这个例子只是表现了其中一部分。
2、面向对象编程的好处不多说了,本人也比较喜欢这种编程,但不算精,也在学习路上。
3、像extjs里面的config和requires这些属性,本人是非常喜欢,extjs不是建议给太多组件命名id,可在大组件命名id,并给这个大组件配置这两个属性之一,就可以很方面找大组件里面的小组件了。

Ext.onReady(function(){
    //Ext.create 实例化一个对象
    var wangwu = Ext.create('Person',{
        name:'王五' , 
        age:30
    });
    Logger.printf2('prototype',Person.prototype.name)
    Logger.printf2('wangwu',wangwu.getName()+' '+wangwu.getAge()+' '+wangwu.say());

    var zhangsan = Ext.create('ohba',{
        name:'张三',
        age:25
    });
    Logger.printf2('zhangsan',zhangsan.name+' '+zhangsan.sex+' '+zhangsan.age);

    var mother = Ext.create('Mother');
    Logger.printf2('mother',Mother.isgiveBirth+' '+mother.Sing()+' '+mother.Dance());
    var boy = mother.giveBirth()
    Logger.printf2('boy',boy.sex);
})
    //---------------------定义和配置--------------------------
    //在Ext中如何去定义一个类: Ext.define(className , properties , callback)
    Ext.define('Person',{
        //这里是对于这个类的一些配置信息
        //config属性 就是配置当前类的属性内容,并且会加上get和set方法
        config:{
            name:'person' , 
            age: 0
        },
        //自己定义的方法
        say:function(){
            return 'say......';
        },
        //给当前定义的类加一个构造器 ,目的就是为了初始化信息
        constructor:function(config){
            var me = this ;
            me.initConfig(config);  // 真正的初始化传递进来的参数
        }
        /*
        在初始化组件模板方法是一个重要的组件的初始化步骤。
        它的目的 是要实现Ext.Component提供任何所需的构造逻辑函数每个子类的。
        在初始化组件模板被创建的类的方法,
        initComponent: function() {
            this.callParent();
        }*/
    });
    //---------------------继承和别名--------------------------
    Ext.define('Boy',{
        //使用Ext的继承
        extend:'Person',
        //别名
        alias: ['male','ohba'],
        config:{
            sex:'男',
            age:20
        }
    });
    //---------------------混入和静态--------------------------  
    Ext.define("Singer",{
        Sing:function(){
            return 'sing.....';
        }
    });
    Ext.define("Danceer",{
        Dance:function(){
            return 'dance.....';
        }
    });

    Ext.define('Mother', {
        statics : {
            isgiveBirth : true
        },
        //requires加载需要的类时机是  当前类初始化之前被加载
        requires: ['Boy'],
        giveBirth: function() {
            // 确保boy类是可用的。
            return new Boy();
        },
        mixins: {
            sing : 'Singer',
            dance : 'Danceer'
        }
    });

    //记录器
    Ext.define('Logger', {
        singleton: true,
        log: function(msg) {
            console.log(msg);
        },
        printf : function(msg){
            this.log(Ext.id('','num:')+'   '+msg);
        },
        printf2 : function(val,msg){
            this.printf(val+'--'+msg);
        },
    });
    Logger.log('Hello');

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值