Override jQuery functions

javascript, jquery

Solution

You almost had it, you need to set the `this` reference inside of the old `size` function to be the `this` reference in the override function, like this:

var oSize = jQuery.fn.size;
jQuery.fn.size = function() {
    alert(this.length);

    // Now go back to jQuery's original size()
    return oSize.apply(this, arguments);
};

The way this works is `Function` instances have a method called `apply`, whose purpose is to arbitrarily override the inner `this` reference inside of the function's body.

So, as an example:

var f = function() { console.log(this); }
f.apply("Hello World", null); //prints "Hello World" to the console

Problem

Is there way to override jQuery's core functions ? Say I wanted to add an alert(this.length) in size: function() Instead of adding it in the source ``` size: function() { alert(this.length) return this.length; }, ``` I was wondering if it would be possible to do something like this : ``` if (console) { console.log("Size of div = " + $("div").size()); var oSize = jQuery.fn.size; jQuery.fn.size = function() { alert(this.length); // Now go back to jQuery's original size() return oSize(this); } console.log("Size of div = " + $("div").size()); } ```

Original source