Ext.js4.2.1 Ext.Class

一：描述


Ext.Class 是一個低層級的工廠類，被Ext.ClassManager使用，一般不直接使用Ext.Class,除非在建立一個匿名類時使用。


如果要建立一個類時請使用Ext.define 它是Ext.ClassManager.create的別名。


Ext.Class是一個工廠類，不是任何類的父類。 所有類的基類是 Ext.Base




二：Config


1.alias 簡稱/別名


如： 


Ext.define('MyApp.CoolPanel', {
    extend: 'Ext.panel.Panel',
    alias: ['widget.coolpanel'],
    title: 'Yeah!'
});


// Using Ext.create
Ext.create('widget.coolpanel');


// Using the shorthand for defining widgets by xtype
Ext.widget('panel', {
    items: [
        {xtype: 'coolpanel', html: 'Foo'},
        {xtype: 'coolpanel', html: 'Bar'}
    ]
});


2.alternateClassName 可選名


如：


Ext.define('Developer', {
    alternateClassName: ['Coder', 'Hacker'],
    code: function(msg) {
        alert('Typing... ' + msg);
    }
});


var joe = Ext.create('Developer');
joe.code('stackoverflow');


var rms = Ext.create('Hacker');
rms.code('hack hack');


3.config  具有預設值的配置引數


如：


Ext.define('SmartPhone', {
     config: {
         hasTouchScreen: false,
         operatingSystem: 'Other',
         price: 500
     },
     constructor: function(cfg) {
         this.initConfig(cfg);
     }
});


var iPhone = new SmartPhone({
     hasTouchScreen: true,
     operatingSystem: 'iOS'
});


iPhone.getPrice(); // 500;
iPhone.getOperatingSystem(); // 'iOS'
iPhone.getHasTouchScreen(); // true;


4.extend  繼承，當前類的父類


如：


Ext.define('Person', {
    say: function(text) { alert(text); }
});


Ext.define('Developer', {
    extend: 'Person',
    say: function(text) { this.callParent(["print "+text]); }
});


5.inheritableStatics  可繼承的靜態方法


6.statics  不可繼承的靜態方法


如：


Ext.define('Computer', {
     statics: {
         factory: function(brand) {
             // 'this' in static methods refer to the class itself
             return new this(brand);
         }
     },


     constructor: function() { ... }
});


var dellComputer = Computer.factory('Dell');


7.mixins  把其它類糅合進當前類


如：


Ext.define('CanSing', {
     sing: function() {
         alert("I'm on the highway to hell...")
     }
});


Ext.define('Musician', {
     mixins: ['CanSing']
})


此時Musician就會擁有一個sing的方法，透過CanSing類mixin而來。




如果，Musician本身已經有了一個sing方法，應該如下操作：


Ext.define('Musician', {
     mixins: {
         canSing: 'CanSing'
     },


     sing: function() {
         // delegate singing operation to mixin
         this.mixins.canSing.sing.call(this);
     }
})




8.requires  當前類載入之前需要載入的類，類似於import


如：


Ext.define('Mother', {
    requires: ['Child'],
    giveBirth: function() {
        // we can be sure that child class is available.
        return new Child();
    }
});


9.singleton  單例模式


10.uses  和當前類一起載入的類，不是必須的類


如：


Ext.define('Mother', {
    uses: ['Child'],
    giveBirth: function() {
        // This code might, or might not work:
        // return new Child();


        // Instead use Ext.create() to load the class at the spot if not loaded already:
        return Ext.create('Child');
    }
});