Ext JS 4.0.7 Sencha Docs

Ext.ClassManager

Files

Ext.ClassManager manages all classes and handles mapping from string class name to actual class objects throughout the whole framework. It is not generally accessed directly, rather through these convenient shorthands:

Basic syntax:

Ext.define(className, properties);

in which properties is an object represent a collection of properties that apply to the class. See 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.

Inheritance:

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

Mixins:

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");

Config:

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'

Statics:

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

Available since: 4.0.0

Defined By

Properties

Ext.ClassManager
view source
: Objectprivate
All classes which were defined through the ClassManager. ...

All classes which were defined through the ClassManager. Keys are the name of the classes and the values are references to the classes.

Defaults to: {}

Available since: 4.0.0

Ext.ClassManager
view source
: Arrayprivate
...

Defaults to: []

Available since: 4.0.0

...

Defaults to: true

Available since: 4.0.0

Ext.ClassManager
view source
: Objectprivate
...

Defaults to: {}

Available since: 4.0.0

Ext.ClassManager
view source
: Objectprivate
...

Defaults to: {}

Available since: 4.0.0

Ext.ClassManager
view source
: Arrayprivate
...

Defaults to: []

Available since: 4.0.0

Ext.ClassManager
view source
: Objectprivate
...

Defaults to: {alternateToName: {}, aliasToName: {}, nameToAliases: {}}

Available since: 4.0.0

Ext.ClassManager
view source
: Objectprivate
...

Defaults to: {}

Available since: 4.0.0

Ext.ClassManager
view source
: Objectprivate

Available since: 4.0.0

Ext.ClassManager
view source
: Objectprivate
...

Defaults to: {}

Available since: 4.0.0

Defined By

Methods

Ext.ClassManager
view source
( className, data, [createdFn] ) : Ext.Base
Defines a class. ...

Defines a class.

Ext.define and Ext.ClassManager.create are almost aliases of each other, with the only exception that Ext.define allows definition of overrides. To avoid trouble, always use Ext.define.

Ext.define('My.awesome.Class', {
    someProperty: 'something',
    someMethod: function() { ... }
    ...

}, function() {
    alert('Created!');
    alert(this === My.awesome.Class); // alerts true

    var myInstance = new this();
});

Available since: 4.0.0

Parameters

  • className : String

    The class name to create in string dot-namespaced format, for example: My.very.awesome.Class, FeedViewer.plugin.CoolPager. It is highly recommended to follow this simple convention:

    • The root and the class name are 'CamelCased'
    • Everything else is lower-cased
  • data : Object

    The key-value pairs of properties to apply to this class. Property names can be of any valid strings, except those in the reserved list below:

  • createdFn : Function (optional)

    callback to execute after the class is created, the execution scope of which (this) will be the newly created class itself.

Returns

Fires

    Ext.ClassManager
    view source
    ( )private
    The new Ext.ns, supports namespace rewriting ...

    The new Ext.ns, supports namespace rewriting

    Available since: 4.0.0

    Fires

      Ext.ClassManager
      view source
      ( name, args )private
      ...

      Available since: 4.0.0

      Parameters

      Ext.ClassManager
      view source
      ( item, namespace )private
      API to be stablized ...

      API to be stablized

      Available since: 4.0.0

      Parameters

      Ext.ClassManager
      view source
      ( name ) : Ext.Class
      Retrieve a class by its name. ...

      Retrieve a class by its name.

      Available since: 4.0.0

      Parameters

      Returns

      Fires

        Ext.ClassManager
        view source
        ( name ) : String[]
        Get the aliases of a class by the class name ...

        Get the aliases of a class by the class name

        Available since: 4.0.0

        Parameters

        Returns

        Ext.ClassManager
        view source
        ( alias ) : Ext.Class
        Get a reference to the class by its alias. ...

        Get a reference to the class by its alias.

        Available since: 4.0.0

        Parameters

        Returns

        Fires

          Ext.ClassManager
          view source
          ( object ) : Ext.Class
          Get the class of the provided object; returns null if it's not an instance of any class created with Ext.define. ...

          Get the class of the provided object; returns null if it's not an instance of any class created with Ext.define.

          var component = new Ext.Component();
          
          Ext.ClassManager.getClass(component); // returns Ext.Component
          

          Ext.getClass is alias for Ext.ClassManager.getClass.

          Available since: 4.0.0

          Parameters

          Returns

          Ext.ClassManager
          view source
          ( object ) : String
          Returns the displayName property or className or object. ...

          Returns the displayName property or className or object. When all else fails, returns "Anonymous".

          Available since: 4.0.0

          Parameters

          Returns

          Ext.ClassManager
          view source
          ( length )private
          ...

          Available since: 4.0.0

          Parameters

          Ext.ClassManager
          view source
          ( object ) : String
          Get the name of the class by its reference or its instance. ...

          Get the name of the class by its reference or its instance.

          Ext.ClassManager.getName(Ext.Action); // returns "Ext.Action"
          

          Ext.getClassName is alias for Ext.ClassManager.getName.

          Available since: 4.0.0

          Parameters

          Returns

          Ext.ClassManager
          view source
          ( alias ) : String
          Get the name of a class by its alias. ...

          Get the name of a class by its alias.

          Available since: 4.0.0

          Parameters

          Returns

          Ext.ClassManager
          view source
          ( alternate ) : String
          Get the name of a class by its alternate name. ...

          Get the name of a class by its alternate name.

          Available since: 4.0.0

          Parameters

          Returns

          Ext.ClassManager
          view source
          ( expression ) : String[]
          Converts a string expression to an array of matching class names. ...

          Converts a string expression to an array of matching class names. An expression can either refers to class aliases or class names. Expressions support wildcards:

          // returns ['Ext.window.Window']
          var window = Ext.ClassManager.getNamesByExpression('widget.window');
          
          // returns ['widget.panel', 'widget.window', ...]
          var allWidgets = Ext.ClassManager.getNamesByExpression('widget.*');
          
          // returns ['Ext.data.Store', 'Ext.data.ArrayProxy', ...]
          var allData = Ext.ClassManager.getNamesByExpression('Ext.data.*');
          

          Available since: 4.0.0

          Parameters

          Returns

          Fires

            Ext.ClassManager
            view source
            ( name, args ) : Object
            Instantiate a class by either full name, alias or alternate name. ...

            Instantiate a class by either full name, alias or alternate name.

            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.ClassManager.instantiate('widget.window', { width: 600, height: 800, ... });
            
            // alternate name
            var window = Ext.ClassManager.instantiate('Ext.Window', { width: 600, height: 800, ... });
            
            // full class name
            var window = Ext.ClassManager.instantiate('Ext.window.Window', { width: 600, height: 800, ... });
            

            Ext.create is alias for Ext.ClassManager.instantiate.

            Available since: 4.0.0

            Parameters

            • name : String
            • args : Object...

              Additional arguments after the name will be passed to the class' constructor.

            Returns

            Fires

              Ext.ClassManager
              view source
              ( alias, args ) : Object
              Instantiate a class by its alias. ...

              Instantiate a class by its alias.

              If Ext.Loader is enabled and the class has not been defined yet, it will attempt to load the class via synchronous loading.

              var window = Ext.ClassManager.instantiateByAlias('widget.window', { width: 600, height: 800, ... });
              

              Ext.createByAlias is alias for Ext.ClassManager.instantiateByAlias.

              Available since: 4.0.0

              Parameters

              • alias : String
              • args : Object...

                Additional arguments after the alias will be passed to the class constructor.

              Returns

              Fires

                Ext.ClassManager
                view source
                ( className ) : Boolean
                Checks if a class has already been created. ...

                Checks if a class has already been created.

                Available since: 4.0.0

                Parameters

                Returns

                Fires

                  Ext.ClassManager
                  view source
                  ( namespace )private
                  Supports namespace rewriting ...

                  Supports namespace rewriting

                  Available since: 4.0.0

                  Parameters

                  Ext.ClassManager
                  view source
                  ( name, postprocessor ) : Ext.ClassManagerchainable
                  Register a post-processor function. ...

                  Register a post-processor function.

                  Available since: 4.0.0

                  Parameters

                  Returns

                  Ext.ClassManager
                  view source
                  ( name, value ) : Ext.ClassManagerchainable
                  Sets a name reference to a class. ...

                  Sets a name reference to a class.

                  Available since: 4.0.0

                  Parameters

                  Returns

                  Fires

                    Ext.ClassManager
                    view source
                    ( cls, alias ) : Ext.ClassManagerchainable
                    Register the alias for a class. ...

                    Register the alias for a class.

                    Available since: 4.0.0

                    Parameters

                    • cls : Ext.Class/String

                      a reference to a class or a className

                    • alias : String

                      Alias to use when referring to this class

                    Returns

                    Fires

                      Ext.ClassManager
                      view source
                      ( name, offset, relativeName ) : Ext.ClassManagerchainable
                      Insert this post-processor at a specific position in the stack, optionally relative to any existing post-processor ...

                      Insert this post-processor at a specific position in the stack, optionally relative to any existing post-processor

                      Available since: 4.0.0

                      Parameters

                      • name : String

                        The post-processor name. Note that it needs to be registered with registerPostprocessor before this

                      • offset : String

                        The insertion position. Four possible values are: 'first', 'last', or: 'before', 'after' (relative to the name provided in the third argument)

                      • relativeName : String

                      Returns

                      Ext.ClassManager
                      view source
                      ( The ) : Ext.ClassManagerchainable
                      Set the default post processors array stack which are applied to every class. ...

                      Set the default post processors array stack which are applied to every class.

                      Available since: 4.0.0

                      Parameters

                      • The : String/String[]

                        name of a registered post processor or an array of registered names.

                      Returns

                      Ext.ClassManager
                      view source
                      ( name, value )
                      Creates a namespace and assign the value to the created object Ext.ClassManager.setNamespace('MyCompany.pkg.Example'...

                      Creates a namespace and assign the value to the created object

                      Ext.ClassManager.setNamespace('MyCompany.pkg.Example', someObject);
                      
                      alert(MyCompany.pkg.Example === someObject); // alerts true
                      

                      Available since: 4.0.0

                      Parameters

                      Fires