javascript - Chrome doesn't recognize console.log when it's called log

Question

Like all programmers, I'm lazy. So in my utils.js there's a simple line:

window.log = console.log

This works fine in firefox, but it makes Chrome cry like a little boy. I have to write console.log to make it work.

Any suggestions?

Answer 1

Chrome's console.log apparently pays attention to what this is so if you do this:

window.log = console.log
log('pancakes')

Then you'll get nothing more than a "TypeError: Illegal invocation" exception for your efforts. However, if you force the appropriate context thusly:

log.apply(console, 'pancakes')

then you'll get your pancakes in the console. That's why you need to wrap console.log in a function if you want to be lazy and just say log: some console.log implementations need to be called with the appropriate context.

However, just window.log = (x) -> console.log(x) is not quite correct as console.log is a variadic function. A better implementation would be this:

window.log = -> console.log.apply(console, arguments)

or to be pedantic, since arguments isn't an array and Function#apply expects an array, "cast" arguments to a real array in the usual way:

window.log = -> console.log.apply(console, Array::slice.call(arguments))

That should work the same everywhere and preserve the variadic nature of console.log. I doubt you need to be that pedantic though, just sending arguments in and pretending it is an array should be fine. You could also use CoffeeScript splats as a short form of the [].slice and arguments stuff:

window.log = (args...) -> console.log(args...)

If you look at the JavaScript version of that you'll see that it is the slice and arguments stuff in disguise.

Of course if you're using plain JavaScript, then one of these will work:

window.log = function() { console.log.apply(console, arguments) };
window.log = function() { console.log.apply(console, Array.prototype.slice.call(arguments)) };

Another option is to use Function#bind to force log to be called in the context of console:

window.log = console.log.bind(console)

The downside is that not every browser supports bind.