Zach Holmquist

I know! Everyone hates Javascript. Except for this weird breed of us that get high of client side interaction of things. Sadly, when JS was in its infancy most of us were developing in IE6 and error messages for bugs were cryptic and useless . . . and at the time JS was being used for adding falling snow on a site, or a countdown to the year 2000. 

These days there have been many advances in JavaScript, the biggest - in my opinion - is the most ignored of them all : console.debug()

From the old days of JS programming, we would do something like:

var x = 5;
var y = 5;
var z = x+y;
alert(z);

This would pop up an alert box with the number 10 in it.

The problem with using alert()’s is when you try to do a loop and the loop never ends because of a coding error and alert boxes are going off everywhere. At which point you have to shutdown your browser and start all over and *hope* that things would fair better a second time.

There is a cure my friend: console.debug()

To use console.debug() you must be in FireFox with Firebug installed. If you don’t know what Firebug is yet, you have been doing it all wrong for far too long! Write your code as normal, but swap the alert() for a console.debug() :

var x = 5;
var y = 5;
var z = x+y;
alert(z)
console.debug(z) 

Refresh your page, launch Firebug and there inside is “5″! Amazing isn’t it?! It gets better though! Firebug gives you Object Inspection, which is incredibly useful when working with others libraries or trying to figure out how to access elements in a JSON object:

 

So there you have it, if you are not using console.debug() - start . . . now! If you are stuck in your alert() ways - I have a solution - override your alert():

window.alert = function(e) {
console.debug(e);
}

Just remember console.debug() does NOT work in IE, nor does it work in Safari, so make sure to comment/remove them before you test in those browsers. If you want to use the Debug Console in Safari ( it is tucked under Develop > Show Error Console ) ( Turn Develop Menu on in Preferences ) you must use :

window.console.log( e );

Also for some reason, you sometimes have to enable Firebug’s console with: