NOTE : class name should not contain underscore(-) in it
Handles class creation throughout the framework. This is
a low level factory that is used by Ext.ClassManager and
generally should not be used directly. If you choose to use Ext.Class you
will lose out on the namespace, aliasing and depency loading features made
available byExt.ClassManager. The only time you would use Ext.Class directly
is to create an anonymous class.
Ext.Class is
the factory and not the superclass of everything
If Ext.Loader is enabled and the class has not been defined yet, it will attempt to load the
class via synchronous loading.
For example, all these three lines
return the same result:
// alias
var window = Ext.create('widget.window', {
width: 600,
height: 800,
...
});
// alternate name
var window = Ext.create('Ext.Window', {
width: 600,
height: 800,
...
});
// full class name
var window = Ext.create('Ext.window.Window', {
width: 600,
height: 800,
...
});
// single object with xclass property:
var window = Ext.create({
xclass: 'Ext.window.Window', // any valid value for 'name' (above)
width: 600,
height: 800,
...
});
Ext.define('My.awesome.Class', {
someProperty: 'something',
someMethod: function() {
alert(s + this.someProperty);
}
...
});
var obj = new My.awesome.Class();
obj.someMethod('Say '); // alerts 'Say something'
To defines an
override, include the override property. The content of an override is aggregated with the
specified class in order to extend or modify that class. This can be as simple
as setting default property values or it can extend and/or replace methods.
This can also extend the statics of the class.
One use for an override is to break
a large class into manageable pieces.
Ext.define('My.app.Panel', {
extend: 'Ext.panel.Panel',
requires: [
'My.app.PanelPart2',
'My.app.PanelPart3'
]
constructor: function (config) {
this.callParent(arguments); // calls Ext.panel.Panel's constructor
//...
},
statics: {
method: function () {
return 'abc';
}
}
});
// File: /src/app/PanelPart2.js
Ext.define('My.app.PanelPart2', {
override: 'My.app.Panel',
constructor: function (config) {
this.callParent(arguments); // calls My.app.Panel's constructor
//...
}
});
Another use of overrides is to
provide optional parts of classes that can be independently required. In this
case, the class may even be unaware of the override altogether.
The above override can now be
required as normal.
Ext.define('My.app.App', {
requires: [
'My.ux.CoolTip'
]
});
Overrides can also contain statics:
Ext.define('My.app.BarMod', {
override: 'Ext.foo.Bar',
statics: {
method: function (x) {
return this.callParent([x * 2]); // call Ext.foo.Bar.method
}
}
});
IMPORTANT: An override is only
included in a build if the class it overrides is required. Otherwise, the
override, like the target class, is not included.
Copies all the properties of config
to object if they don't already exist.
If the
environment's native JSON encoding is not being used (USE_NATIVE_JSON is not set, or the environment does not support it), then ExtJS's
encoding will be used. This allows the developer to add a toJSON method to their classes which need serializing to return a valid
JSON representation of the object.
Overrides
members of the specified target with the given values.
var panel = new Ext.Panel({ ... });
Ext.override(panel, {
initComponent: function () {
// extra processing...
this.callParent();
}
});
If the target is none of these, the overrides are applied to the target using Ext.apply.
The parent class that this class
extends. For example:
Ext.define('Person', {
say: function(text) { alert(text); }
});
Ext.define('Developer', {
extend: 'Person',
say: function(text) { this.callParent(["print "+text]); }
});
