javascript:base.superclass.constructor.call(this,config)
2015-03-06 10:32
441 查看
javascript中类的继承机制如下,有一个baseClass的类,然后为其定义两个方法,someMethod()和overwriteMethod()
1 | var BaseClass= function (){ |
4 | BaseClass.prototype.someMethod= function (){ |
7 | BaseClass.prototype.overridenMethod= function (){ |
对于Extjs的类的继承,有几个函数需要注意一下
Ext.apply(obj,config,[defaults])将config对象的所有属性都复制到另一个对象obj上,第三个参数defaults可以用来提供默认值,不过通常指用前两个参数就够了。这个函数主要用在构造函数中,用来将配置复制到对象上。 Ext.applyIf(obj,config)和Ext.apply的功能类似,唯一不同的是,这个函数只会将config对象中有,而obj对象中没有的属性复制到obj上。 Ext.extend(subclass,superclass,[overrides])用来继承已有的类 对于类的继承有几下几种方式:
1javascript实现类的继承
01 | var SubClass= function (){ |
04 | SubClass.prototype= new BaseClass(); |
05 | SubClass.prototype.newMethod= function (){ |
08 | SubClass.prototype.overridenMethod= function (){ |
2使用EXTjs的extend()函数
2 | SubClass.superclass.constructor.call( this ); |
4 | Ext.extend(SubClass,BaseClass,{ |
6 | overriddenMethod: function (){} |
3extjs中替换constructor
01 | //initComponentreplacestheconstructor: |
02 | SubClass=Ext.extend(BaseClass,{ |
03 | initComponent: function (){ |
04 | //callsuperclassinitComponent |
05 | Ext.Container.superclass.initComponent.call( this ); |
Ext.extend()函数提供了直接访问父类构造函数的途径,通过SubClass.superclass.constructor.call(this);就可以直接调用父类的构造函数,这个函数的第一个参数总是this,以确保父类的构造函数在子类的作用域里工作。 如果父类的构造函数需要传入参数,可以讲所需的参数直接传递给它:SubClass.superclass.constructor.call(this,config);这样就得到了一个继承了父类的所有属性和函数的子类。 下面是一个完整的类继承的例子
03 | SuperClass.prototype.AA= function (){ |
08 | SubClass.superclass.constructor.call( this ); |
10 | Ext.extend(SubClass,SuperClass,{ |
11 | BB: function (){alert( '新方法' );}, |
12 | AA: function (){alert( '重写方法' );} |
13 | } //配置信息主要用来重写父类的方法和添加新方法 |
结果是alert出重写方法,和新方法。
这里补充一个稍微复杂的例子,以下是两种不同的继承方式
01 | IDB.WebsqlConsole=Ext.extend(IDB.MyTabPanel,{ |
02 | initComponent: function (){ |
03 | this .databasePanel= new Ext.Panel({title: '标题1' }); |
04 | this .tabPanel= new Ext.Panel({title: '标题2' }) |
05 | this .sqlConsole= new Ext.Panel({title: '标题3' }); |
08 | this .databasePanel, this .tabPanel, this .sqlConsole |
10 | getDatabasePanel: function (){ |
11 | return this .databasePanel; |
14 | IDB.WebsqlConsole.superclass.initComponent.call( this ); |
1 | IDB.ConsoleManager= function (){ |
2 | IDB.ConsoleManager.superclass.constructor.call( this ,{ |
3 | items:[ new Ext.Panel({title: '标题1' })] |
6 | Ext.extend(IDB.ConsoleManager,IDB.MyTabPanel) |
总结一下,对于EXTjs来说,有一个base类,子类使用extend来继承base类,extend有三个参数,第一个是子类即this,第二个参数是base类,第三个参数是config。另外子类在构造的时候使用subclase.superclass.construtor.call(this);来构造。