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初始化。