Extjs學習筆記——Ext自定義類

首先說下JavaScript中自定義類的用法如下：

var Person = function( name, age ){
this.Name = '';
this.Age = 0;
this.Say = function(msg){
alert(this.Name + "Says:" + msg);
}
this.init = function( name, age ){
this.name = name;
this.age = age;
}
this.init( name, age );
}

代碼中定義了Person類，它具有Name和Age兩個屬性，具有Say和init公有方法，當類創建時回調用init方法實現初始化。init方法可看作是類的構造函數。

Ext自定義類

那麼Extjs是如何實現自定義類呢，如下：

Ext.define('Person',{
Name:'',
Age:0,
Say:function(msg){
Ext.Msg.alert(this.Name + 'Says', msg);
},
constructor:function(name,age){
this.name = name;
this.age = age;
}
})

使用Ext.define定義了Person類，它同樣具有Name和Age兩個屬性，具有Say方法，而constructor是它的構造函數，省去了init的方法的代碼。

Ext類的繼承

Extjs允許對類進行擴展，擴展通過繼承來實現，我們對剛剛定義的Person類進行繼承，定義一個developer類，它繼承自Person，同時擁有Conding方法，如下：

Ext.define('Developer',{
extend:'Person',
Coding:function(code){
Ext.Msg.alert(this.Name + '正在編寫', code)；
}
constructor:function(){
this.callParent(arguments);
}
})

Ext類的選項

var win = Ext.create('Ext.window.Window',{
title:'text',
width:300,
height:200
});
win.show();

Ext.create方法的一個參數是類名，第二個參數是類的選項，他是一個json格式對象，用來初始化window對象。

Extjs可以在定義類的時候爲它添加配置項，然後調用Extjs內置的方法完成初始化，並可生成訪問器，如下通過修改Person類，使它可以通過config初始化：

Ext.define('Person',{
config:{
Name:'',
Age:0,
},
Say:function(msg){
alert(this.Name + 'Says:', msg);
},
constructor:function(config){
this.initConfig(config);
}
})

Person類中定義config項，在構造函數中通過調用this.initConfig方法完成對config初始化。