Search code examples
javascriptdomfunctionfirebug

Firebug constructor function vs user function


I made a quick search about what is the meaning of Firebug DOM tab coloring and I see the the explanation below from here

Red colored bold text points "constructor function"

Green colored bold text points "user function".

What is the difference between the two type of functions?


Solution

  • The jQuery function is a constructor function ($ is merely a reference to jQuery). You can see that when you see its definition:

    var jQuery = function( selector, context ) {
        // The jQuery object is actually just the init constructor 'enhanced'
        return new jQuery.fn.init( selector, context );
    },
    …
    jQuery.fn = jQuery.prototype = {
        init: function( …
    

    You can reproduce this behaviour (the bold red coloring) when defining a constructor function and adding something to its prototype object, like

    var testFunc = function () {
        /* nothing so far */
    };
    
    testFunc.prototype.baz = function () {
        /* nothing, this gets boring */
    };
    

    or even just a random number

    testFunc.prototype.baz = 4;
    

    Note that this doesn't comply with the actual definition of a constructor function in JavaScript. If you test the linked source code in Firebug, car will be colored green, not red. Furthermore, see The Benefits of JavaScript Prototype.