ExtJS4のクラス定義まわり

※ここの内容はExtJS4 beta1で確認しました。正式リリース版では変わるかもしれません

Ext.define

Ext JS4でクラスを定義するにはExt.defineをコールします。
Ext.defineは3つの引数を取ります。

1. （パッケージ名含む）クラス名の文字列
2. クラス設定値のオブジェクト
3. クラスを定義したときのコールバック関数

クラス設定値のオブジェクトには下記の設定を指定できます。（デフォルト）

• extend
  • スーパークラスを指定します
• mixins
  • スーパークラス以外のクラスからインスタンスメソッドを取り込みます
• config
  • クラスのインスタンス属性を定義します。属性ごとにsetter/getter/apply/resetのメソッドが提供されます
• statics
  • クラスのスタティック属性を定義します

• alias
  • クラスのxtypeを定義します
• singleton
  • クラスをシングルトンにします
• alternateClassName
  • クラス名の別名を定義します

Ext.define('My.awesome.Foo1',{ 
        foo1: function(){
            console.log("this is foo1");
        }
    });

Ext.define('My.awesome.Foo2',{ 
        foo2: function(){
            console.log("this is foo2");
        }
    });

Ext.define('My.awesome.Bar',{ 
});


Ext.define('My.awesome.Hoge',{

        //My.awesome.Barクラスを継承します
        extend: 'My.awesome.Bar',

　　　　//My.awesome.Foo1クラスのfoo1メソッドとMy.awesome.Foo2のfoo2メソッドをこのクラスのインスタンスメソッドにします
        mixins: {
            foo1: My.awesome.Foo1,
            foo2: My.awesome.Foo2
        },

　　　　//属性「fuga」と「piyo」を定義します
        config: {
            fuga: 100,
            piyo: "hello"
        },

　　　　//クラスのスタティック属性を定義します
        statics: {
            say: function(){
                console.log("this is static");
            }
        },

　　　　//コンストラクタ
        constructor: function(config) {
            this.initConfig(config);
            return this;
        }
    },
    function(cls){
        console.log('クラスを定義したときのコールバックです');
    });

Ext.create

クラスをインスタンス化するにはExt.createをコールします。
Ext.createは2つの引数を取ります。

1. （パッケージ名含む）クラス名の文字列
2. 引数のオブジェクト

var hoge = Ext.create('My.awesome.Hoge',{
        fuga: 200
    });

hoge.foo1();
hoge.foo2();
console.log(hoge.getFuga());
console.log(hoge.getPiyo());
My.awesome.Hoge.say();

実行結果

//クラスを定義したときのコールバック関数
クラスを定義したときのコールバックです

//mixinsで取り込んだメソッド
this is foo1
this is foo2

//インスタンス属性
200
hello

//スタティック属性
this is static