我注意到,在我最近修改的许多程序中,它们总是调用当前对象的父参数。我知道这是必要的,但对为什么这是一种常见的做法没有充分的理解。对于初级开发人员的任何智慧......我应该知道这一点。
3 回答
这是 ExtJS 用来支持构造函数中的类继承的机制。调用this.callParent(arguments)
构造函数会调用正在扩展的直接父类的构造函数。
我不知道这个问题是关于哪个版本的。但就我的代码而言,在 Ext JS 5 中,callParent()
- 调用当前方法的“父”方法。那是先前被派生或覆盖覆盖的方法
试试这个代码。
MyApp.test::LifecycleExample.js
Ext.define('MyApp.test.LifecycleExample', {
extend: 'MyApp.test.TrialComponent',
initComponent: function() {
var me = this;
me.width = 200;
me.height = 100;
me.html = {
tag: 'div',
html: 'X',
style: {
'float': 'right',
'padding': '10px',
'background-color': '#e00',
'color': '#fff',
'font-weight': 'bold'
}
};
console.log("init is called before callParent()");
me.myOwnProperty = [1, 2, 3, 4];
me.callParent();
console.log('1. initComponent');
},
beforeRender: function() {
console.log('2. beforeRender');
this.callParent(arguments);
},
onRender: function() {
console.log('3. onRender');
this.callParent(arguments);
this.el.setStyle('background-color', '#ff0');
},
afterRender: function() {
console.log('4. afterRender');
this.callParent(arguments);
this.el.down('div').on('click', this.myCallback, this);
},
beforeDestroy: function() {
console.log('5. beforeDestroy');
this.callParent(arguments);
},
onDestroy: function() {
console.log('6. onDestroy');
delete this.myOwnProperty;
this.el.un('click', this.myCallback);
this.callParent(arguments);
},
myCallback: function() {
var me = this;
Ext.Msg.confirm('Confirmation', 'Are you sure you want to close this panel?', function(btn) {
if (btn === 'yes') {
me.destroy();
}
});
}
});
MyApp.test::TrialComponent.js (Ext.Component)
Ext.define('MyApp.test.TrialComponent', {
extend: 'Ext.Component',
constructor: function() {
console.log('parent const');
this.initComponent();
},
constructor: function(config) {
console.log('parent const config' + config);
this.initComponent();
}
});
浏览器控制台的输出是:
parent const config[object Object]
init is called before callParent()
1. initComponent
callParent( args ) 调用当前方法的“父”方法。那是先前被派生或覆盖覆盖的方法
参考是 ext js api 文档。
http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext.Base-method-callParent
根据文档(感谢 javaCoder)http://docs.sencha.com/extjs/5.0/5.0.1-apidocs/#!/api/Ext.Base-static-method-callParent:
Call the "parent" method of the current method. That is the method previously overridden by derivation or by an override (see Ext.define).
并且arguments
是:
Parameters
args : Array/Arguments
The arguments, either an array or the arguments object from the current method, for example: this.callParent(arguments)
虽然这对我来说暗示了arguments
这个方法的参数对象。但是,在查看开发人员工具时,该对象被封装在另一个对象中,该对象还包含一些其他信息,例如被调用者: