This function is built into the page and I cannot modify the original .js file:

cool.lol = function () {

    // contents here

}

Is there a way for me to append this function with some of my own scripts?

Like this:

cool.lol = function () {

    // contents here

    // i would like to add my own stuff here!!!
}

Or is there a way for me to detect that the function has been executed so I can run something after it?

This function is built into the page and I cannot modify the original .js file:

cool.lol = function () {

    // contents here

}

Is there a way for me to append this function with some of my own scripts?

Like this:

cool.lol = function () {

    // contents here

    // i would like to add my own stuff here!!!
}

Or is there a way for me to detect that the function has been executed so I can run something after it?

• javascript
• jquery

• forum.jquery./topic/… – Tats_innit Commented May 25, 2012 at 2:41

5 Answers 5

Here's a demo of the following. Updated to use a closure and remove the need for a temporary variable.

//your cool with lol
var cool = {
    lol: function() {
        alert('lol');
    }
}

//let's have a closure that carries the original cool.lol
//and returns our new function with additional stuff

cool.lol = (function(temp) { //cool.lol is now the local temp
    return function(){       //return our new function carrying the old cool.lol
        temp.call(cool);     //execute the old cool.lol
        alert('bar');        //additional stuff
    }
}(cool.lol));                //pass in our original cool.lol

cool.lol();
cool.lol();​

http://jsfiddle/Pcxn5/1/

// original definition which you can't touch
var cool = {
    lol: function() {
        alert("test");
    }
}
//

// your script
var ori = cool.lol;
cool.lol = function() {
    ori();
    alert('my test');
}

cool.lol();​

You can override the function:

// The file you can't touch has something like this
var cool = {};
cool.lol = function () {
    console.log("original");
}

// Keep a copy of the original function.
// Override the original and execute the copy inside
var original = cool.lol;
cool.lol = function () {
    original();
    console.log("modified");
}

// Call
cool.lol();​ // logs "original", then "modified".

http://jsfiddle/K8SLH/

Without creating variables polluting the public scope:

 //let's have your cool namespace
var cool = {
    lol: function() {
        alert('lol');
    }
}

//temporarily store
cool.lol_original = cool.lol;

//overwrite
cool.lol = function() {
    this.lol_original(); //call the original function
    alert('bar');    //do some additional stuff
}

cool.lol();​

JavaScript allows you to

• get the code of the functions as a string
• create new functions by supplying a string with code

Every object has a toString() method. For functions, it returns their code (unless overriden).

cool.lol.toString();

returns function() { // contents here }.

Let us extract the body of the function from this string. It starts immediately after { and includes everything except the last }.

var code = cool.lol.toString();
var body = code.substring(code.indexOf('{') + 1, code.length - 1);

Then we add more stuff

var newBody = body + '// i would like to add my own stuff here!!!';

and create a new function using the Function constructor.

https://developer.mozilla/en/JavaScript/Reference/Global_Objects/Function

cool.lol = new Function(newBody);

Of course, there is more work to do if the new function also has to retain arguments (you have to parse them out from the function code, then give them as parameters to the Function constructor). For simplicity, in this case I assumed there are no arguments to the function.

An example implementation:

http://jsfiddle/QA9Zx/