Is there a method I can override on a JavaScript object to control what is displayed by console.log?

Question

I'm thinking in particular of Chrome, though Firebug would be interesting to. I've tried toString() and valueOf(), but neither of those seem to be used. Interestingly, if I take a function it'll display the function definition - but then if I add a toString() method it will show null!

var a = function(){};
console.log(a); // output: function (){}
a.toString = function(){ return 'a'; };
console.log(a); // output: null
a.valueOf = function(){ return 'v'; };
console.log(a); // output: null

Any ideas?

Answer 1

There's no way I know of. Your best bet will be to define a toString() method on the object you want to log and then call it, either directly or indirectly:

var o = {};
o.toString = function() {
    return "Three blind mice";
};

console.log("" + o);
console.log(o.toString());

Shameless plug: the forthcoming version 1.5 of log4javascript will have Renderers to do this, similar to those found in log4j.

Answer 2

You should get a better result from Firebug, you should get

var a = function(){}; console.log(a); // output: function a.toString = function(){ return 'a'; }; console.log(a); // output: function, {toString()} a.valueOf = function(){ return 'v'; }; console.log(a); // output: function, {toString(), valueOf()}

http://code.google.com/p/fbug/issues/detail?id=3117