how to extend a method in javascript?

Question

I want to add additional functionality to a method, for instance:

console.log()

so the original 'log' functionality is retained, and I can get it to do something new as well. Is this possible? I've read a few bits on using prototype but haven't quite grasped it.

Many thanks,

Answer 1

It's very easy. If you want your new log mehod to be in place of the old log method just do something like that:

console._log = console.log; // just backing up old log method
console.log = function(){
    console._log(arguments);
    alert("I'm doing something else here");     
}
console.log(console);

---

UPDATE:

All the solutions presented, including mine, didn't reproduced the log behavior perfectly as @TomBates stated. The output differed because arguments were being logged wrapped in an object instead of passed separately. The only way I could find to reproduce the behavior of the old log + the extending functionality was doing this:

    console.log(window, this, console); // old log in action

console._log = console.log; // just backing up old log method
console.log = function(){
    var args_string = '';
    for(i in arguments){
        if(arguments.hasOwnProperty(i)){
            args_string += 'arguments['+ i + ']';
            if(i != arguments.length - 1){
                args_string += ',';
            } 
        }
    }
    var expression = 'console._log(' + args_string + ');';
    eval(expression);

    alert("I'm doing something else here"); 
    // your dazzling method extension here   
}

console.log(window, this, console); //new log in action

Not so elegant, but works as expected. the outputs of both old log and new log are now identical.

Answer 2

as javascript is callable oriented, you could do:

console._log_without_my_extension = console.log
console.log = function() { console._log_without_my_extension(); .... }

for example.

Answer 3

Extending in JS is not a default functionality as far as I know the only way is something like the following:

var oldLog = console.log;
console.log = function(){
    //doStuff
    oldLog(arguments);
    //doStuff
}

Answer 4

You can use prototype property only when objects already have them. console is not one of them. Use other answers for this. And read this to learn about prototype :

http://phrogz.net/js/classes/ExtendingJavaScriptObjectsAndClasses.html

By the way: there is no way to extend functions unless you make a wrapper, just like suggested in other answers.

Answer 5

If you are strictly trying to extend the console in Firebug it doesn't have a prototype, so you will be fine doing this

console.logMe = function(){console.log(arguments)};
console.logMe("welcome to SO");

Update

Since i had understood the question wrong manner i would like to correct it. The OP wanted to abstract the base method away and override the base method.(Seems like i am talking rubbish, look into code below)

function myConsole() {}

myConsole.prototype = {
    _log: console.log,
    Log: function () {
        this._log(arguments)
    }
};

with all other methods you will have to do it again and again. But here every instance you create will have the extended method and your very own inbuilt implementation.

Usage

var x = new myConsole();
x.Log("Hi this is Deeptechtons");