32

Is it possible to extend the console object?

I tried something like:

Console.prototype.log = function(msg){
    Console.prototype.log.call(msg);
    alert(msg);
}

But this didn't work. I want to add additional logging to the console object via a framework like log4javascript and still use the standard console object (in cases where log4javascript is not available) in my code.

Thanks in advance!

1
  • 5
    why are you extending the prototype object instead of extending the Console object itself? Do you ever call new Console()? Commented Feb 14, 2012 at 13:43

6 Answers 6

47

Try following:

(function() {
    var exLog = console.log;
    console.log = function(msg) {
        exLog.apply(this, arguments);
        alert(msg);
    }
})()
Sign up to request clarification or add additional context in comments.

Comments

6

It's really the same solution some others have given, but I believe this is the most elegant and least hacky way to accomplish this. The spread syntax (...args) makes sure not a single argument is lost.

var _console={...console}

console.log = function(...args) {
    var msg = {...args}[0];
    //YOUR_CODE
    _console.log(...args);
}

1 Comment

nice use of the spread/rest syntax, but its not needed, theres a 1 line smaller way that supports IE an doesnt overwrite protos above.
4

You Can Also add log Time in This Way :

added Momentjs or use New Date() instead of moment.

var oldConsole = console.log;
console.log = function(){
    var timestamp = "[" + moment().format("YYYY-MM-DD HH:mm:ss:SSS") + "] ";
    Array.prototype.unshift.call(arguments, timestamp);
    oldConsole.apply(this, arguments);
};

3 Comments

This doesn't work as it generates a "moment is not defined" error.
you have to install moment using npm install moment
ok, I guess, I'd prefer a native solution though. For example NPM is yet "another" thing that needs to be present
2

For ECMAScript 2015 and later

You can use the newer Proxy feature from the ECMAScript 2015 standard to "hijack" the global console.log.

Source-Code

'use strict';

class Mocker {
  static mockConsoleLog() {
    Mocker.oldGlobalConsole = window.console;

    window.console = new Proxy(window.console, {
      get(target, property) {
        if (property === 'log') {
          return function(...parameters) {
            Mocker.consoleLogReturnValue = parameters.join(' ');
          }
        }

        return target[property];
      }
    });
  }

  static unmockConsoleLog() {
    window.console = Mocker.oldGlobalConsole;
  }
}

Mocker.mockConsoleLog();

console.log('hello'); // nothing happens here

Mocker.unmockConsoleLog();

if (Mocker.consoleLogReturnValue === 'hello') {
  console.log('Hello world!'); // Hello world!
  alert(Mocker.consoleLogReturnValue);
  // anything you want to do with the console log return value here...
}

Online Demo

Repl.it.

Node.js users...

... I do not forget you. You can take this source-code and replace window.console by gloabl.console to properly reference the console object (and of course, get rid of the alert call). In fact, I wrote this code initially and tested it on Node.js.

2 Comments

this is enormous compared to the answer above with a 6 line overwriter, I think this is overkill for a simple function rewrite
No, do not use proxies to hijack a single property.
1
// console aliases and verbose logger - console doesnt prototype
var c = console;
c.l = c.log,
c.e = c.error,
c.v = c.verbose = function() {
    if (!myclass || !myclass.verbose) // verbose switch
        return;
    var args = Array.prototype.slice.call(arguments); // toArray
    args.unshift('Verbose:');
    c.l.apply(this, args); // log
};

// you can then do
var myclass = new myClass();
myclass.prototype.verbose = false;
// generally these calls would be inside your class
c.v('1 This will NOT log as verbose == false');
c.l('2 This will log');
myclass.verbose = true;
c.v('3 This will log');

I noted that the above use of Array.prototype.unshift.call by nitesh is a better way to add the 'Verbose:' tag.

Comments

0

You can override the default behavior of the console.log function using the below approach, the below example demonstrates to log the line number using the overridden function.

let line = 0;
const log = console.log;
console.log = (...data) => log(`${++line} ===>`, ...data)

console.log(11, 1, 2)
console.log(11, 1, 'some')

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.