How not to let console.log() to cause error on IE or other browsers

JavaScript
1

sometimes we solely use console.log() to debug on Firefox. (i think it is only defined when Firebug is installed?) And the code will break IE or any Firefox that doesn’t have Firebug installed, since console and console.log will be undefined.

so i wonder how about disabling it just by

if (typeof console == “undefined” || typeof console.log == “undefined”) var console = { log: function() {} };

at the very top of javascript code. It is true we could use

if (debugging) console.log(oDiv)

but then we need to constant turn debugging on and off on different browsers, and it is more troublesome to use “if (debugging)” every time.

This following line will work too:

if (typeof console == “undefined”) var console = { log: function() {} };

except there might be some browser in which console is defined, but console.log is undefined… and using console.log() in those browser will cause an error. So the first solution in this post that test for both console and console.log is a better check.

2

That sounds like an interesting idea. I would have thought though that cross-browser testing would have caught anything untoward that remained.

I’m also not keen on the idea of having some console.log commands remain in production code that will get seen by visitors who also use firebug.

3

yeah, when it is production, we can remove all the console.log() calls…

or if we don’t care about them remaining in the code, we can use

var debugging = false; // or true
if (!debugging || typeof console == “undefined” || typeof console.log == “undefined”) var console = { log: function() {} };

hm… but I think Firefox with Firebug doesn’t let us redefine console… so maybe there is another way… (just found out that console.log can be reassigned on Firefox with Firebug) something like

var debugging = false; // or true
if (typeof console == “undefined” || typeof console.log == “undefined”) var console = { log: function() {} };
else if (!debugging && typeof console != “undefined”) console.log = function() {};

you meant to use Browser sniffing to define console.log()? I tried it too and since my Firefox on Mac doesn’t have Firebug, it gave error for using console.log() when it is not defined.

4

actually, i think this is a better solution:

var debugging = false; // or true
if (typeof console == “undefined”) var console = { log: function() {} };
else if (!debugging || typeof console.log == “undefined”) console.log = function() {};

the logic goes:

if console is undefined, that means it is on IE or Firefox without Firebug, so just make console.log to be an empty function.
otherwise, console is defined. but could there be some browser that actually doesn’t have console.log defined? In that case, set console.log to an empty function. Also, when console is defined but we are not in debugging mode, then also set console.log to an empty function.

5

window.log = function ( string ) {
if ( typeof console == ‘object’ ) { console.log ( string );
}

6

and then just use window.log() in our code for print debug string huh?

console.log accepts multiple parameters… but window.log can probably be made to do that too…

also it checks console every time. so can we do

if (typeof console == “object”) window.log = console.log;
else window.log = function() {};

and since window is the current object, we can just use

if (typeof console == “object”) log = console.log;
else log = function() {};

and then use

log(123, oDiv, s); to debug our code.