Categories

jQuery.Class()

Categories: Utilities

jQuery.Class( classname, [ superclass ], properties )Returns: Object

Plugin: jQuery.class

Description: Create a class object.

  • jQuery.Class( classname, [ superclass ], properties )

    version added: 1.0

    classname   A scope name in dot natation to define the class.

    superclass   A class object or an array of class objects.

    properties   An object of methods and properties for the speciefied class.

Javascript doesn't have a Class system like Java, jQuery.Class() simulate this.

Setup a constuctor for the class

If a method of the properties named Constructor, it will be interpreted as the constructor method on calling a new instance of the class. Also all constuctors of superclasses will be exectuted on calling a new instance of the class.

Call overwritten inherited methods

If a class overwrites a method of a superclass with an own method, you can call the original method inside of the new method in the following way this.Inherited( arguments ). The arguments property is optional, but if the original method expects properties, you must commit the arguments.

  • Working with the class system.

    Code:
    // define a class object
    $.Class( 'example.Controller', {
        Contructor: function(){
            this.handles = {};
        },
        addHandle: function( name, fn ){
            this.handles[ name ] = fn;
        },
        removeHandle: function( name ){
            delete( this.handles[ name ] );
        }
    });
    
    // define a class object and inherit properties from a superclass
    $.Class( 'advanced.Controller', example.Controller, {
        Contructor: function( rsort ){
            // the inherited Constructor method will be run automatically
            this.handlesSort = [];
            this.rsort = rsort;
        },
        addHandle: function( name, fn ){
            // call the inherited method
            this.Inherited(arguments);
    
            if( !$.inArray(name, this.handlesSort) ){
                this.handlesSort.push(name);
            }
        },
        removeHandle: function( name ){
            // call the inherited method
            this.Inherited(arguments);
    
            var i = $.inArray(name, this.handlesSort);
            this.handlesSort.splice(i,1);
        },
        getSorted: function(){
            var result = {};
    
            this.handlesSort.sort();
    
            if( this.rsort ){
                this.handlesSort.reverse();
            }
    
            // run each with a changed context
            $.each( this.handlesSort, this.Proxy(function( i, name ){
                result[ name ] = this.handles[ name ];
            }));
    
            return result;
        }
    });
    
    // get a instance on a class
    var test = new advanced.Controller();
    
    // add handles to this instance
    test.addHandle( 'C', function(){} );
    test.addHandle( 'B', function(){} );
    test.addHandle( 'A', function(){} );
    
    // remove a handle
    test.removeHandle( 'B' );
    
    // set the rsort property to true, to reverse order on call .getSorted()
    test.rsort = true;
    
    // get all handles
    test.getSorted();
    Results:
    {
        'A': function(){},
        'B': function(){}
    }
  • .Proxy()

    • .Proxy( function )

      version added: 1.0

      function   The function or the name of a function(from current instance) whose context will be changed to the current instance.

    This method is most useful for attaching event handlers to an element where the context is the current class instance. Additionally, jQuery makes sure that even if you bind the function returned from .Proxy() it will still unbind the correct function, if passed the original.