Handles class creation throughout the whole framework. Note that most of the time Ext.define should -be used instead, since it's a higher level wrapper that aliases to Ext.ClassManager.create -to enable namespacing and dynamic dependency resolution.
- -Ext.define(className, properties);
-in which properties is an object represent a collection of properties that apply to the class. See
-Ext.ClassManager.create for more detailed instructions.
Ext.define('Person', {
- name: 'Unknown',
-
- constructor: function(name) {
- if (name) {
- this.name = name;
- }
-
- return this;
- },
-
- eat: function(foodType) {
- alert("I'm eating: " + foodType);
-
- return this;
- }
-});
-
-var aaron = new Person("Aaron");
-aaron.eat("Sandwich"); // alert("I'm eating: Sandwich");
-Ext.Class has a powerful set of extensible pre-processors which takes care of -everything related to class creation, including but not limited to inheritance, mixins, configuration, statics, etc.
- -Ext.define('Developer', {
- extend: 'Person',
-
- constructor: function(name, isGeek) {
- this.isGeek = isGeek;
-
- // Apply a method from the parent class' prototype
- this.callParent([name]);
-
- return this;
-
- },
-
- code: function(language) {
- alert("I'm coding in: " + language);
-
- this.eat("Bugs");
-
- return this;
- }
-});
-
-var jacky = new Developer("Jacky", true);
-jacky.code("JavaScript"); // alert("I'm coding in: JavaScript");
- // alert("I'm eating: Bugs");
-See Ext.Base.callParent for more details on calling superclass' methods
- -Ext.define('CanPlayGuitar', {
- playGuitar: function() {
- alert("F#...G...D...A");
- }
-});
-
-Ext.define('CanComposeSongs', {
- composeSongs: function() { ... }
-});
-
-Ext.define('CanSing', {
- sing: function() {
- alert("I'm on the highway to hell...")
- }
-});
-
-Ext.define('Musician', {
- extend: 'Person',
-
- mixins: {
- canPlayGuitar: 'CanPlayGuitar',
- canComposeSongs: 'CanComposeSongs',
- canSing: 'CanSing'
- }
-})
-
-Ext.define('CoolPerson', {
- extend: 'Person',
-
- mixins: {
- canPlayGuitar: 'CanPlayGuitar',
- canSing: 'CanSing'
- },
-
- sing: function() {
- alert("Ahem....");
-
- this.mixins.canSing.sing.call(this);
-
- alert("[Playing guitar at the same time...]");
-
- this.playGuitar();
- }
-});
-
-var me = new CoolPerson("Jacky");
-
-me.sing(); // alert("Ahem...");
- // alert("I'm on the highway to hell...");
- // alert("[Playing guitar at the same time...]");
- // alert("F#...G...D...A");
-Ext.define('SmartPhone', {
- config: {
- hasTouchScreen: false,
- operatingSystem: 'Other',
- price: 500
- },
-
- isExpensive: false,
-
- constructor: function(config) {
- this.initConfig(config);
-
- return this;
- },
-
- applyPrice: function(price) {
- this.isExpensive = (price > 500);
-
- return price;
- },
-
- applyOperatingSystem: function(operatingSystem) {
- if (!(/^(iOS|Android|BlackBerry)$/i).test(operatingSystem)) {
- return 'Other';
- }
-
- return operatingSystem;
- }
-});
-
-var iPhone = new SmartPhone({
- hasTouchScreen: true,
- operatingSystem: 'iOS'
-});
-
-iPhone.getPrice(); // 500;
-iPhone.getOperatingSystem(); // 'iOS'
-iPhone.getHasTouchScreen(); // true;
-iPhone.hasTouchScreen(); // true
-
-iPhone.isExpensive; // false;
-iPhone.setPrice(600);
-iPhone.getPrice(); // 600
-iPhone.isExpensive; // true;
-
-iPhone.setOperatingSystem('AlienOS');
-iPhone.getOperatingSystem(); // 'Other'
-Ext.define('Computer', {
- statics: {
- factory: function(brand) {
- // 'this' in static methods refer to the class itself
- return new this(brand);
- }
- },
-
- constructor: function() { ... }
-});
-
-var dellComputer = Computer.factory('Dell');
-Also see Ext.Base.statics and Ext.Base.self for more details on accessing -static properties within class methods
-Retrieve the array stack of default pre-processors
-Retrieve the array stack of default pre-processors
-defaultPreprocessors
-Retrieve a pre-processor callback function by its name, which has been registered before
-Retrieve a pre-processor callback function by its name, which has been registered before
-preprocessor
-Register a new pre-processor to be used during the class creation process registerPreprocessor
-Register a new pre-processor to be used during the class creation process registerPreprocessor
-The pre-processor's name
-The callback function to be executed. Typical format:
- -function(cls, data, fn) {
- // Your code here
-
- // Execute this when the processing is finished.
- // Asynchronous processing is perfectly ok
- if (fn) {
- fn.call(this, cls, data);
- }
-});
-Passed arguments for this function are:
- -{Function} cls: The created class{Object} data: The set of properties passed in Ext.Class constructor{Function} fn: The callback function that must to be executed when this pre-processor finishes,
-regardless of whether the processing is synchronous or aynchronousthis
-Insert this pre-processor at a specific position in the stack, optionally relative to -any existing pre-processor. For example:
- -Ext.Class.registerPreprocessor('debug', function(cls, data, fn) {
- // Your code here
-
- if (fn) {
- fn.call(this, cls, data);
- }
-}).insertDefaultPreprocessor('debug', 'last');
-The pre-processor name. Note that it needs to be registered with -registerPreprocessor before this
-The insertion position. Four possible values are: -'first', 'last', or: 'before', 'after' (relative to the name provided in the third argument)
-this
-