What to use for debugging, console.log() or alert()

When I started using JavaScript, the alert function quickly became my best friend. I didn't use it to display annoying messages to my users. I used to debug my code. The cool thing about it is that it stopped execution of all the code until I press the OK button, just like a real debugging tool. It was the best ever.

Now many years have passed and people decided to take JavaScript a little more seriously. Great debugging tools have been created to make our life easier when developing JavaScript applications. The first tool I started using was Internet Explorer's developer tools. Despite all the arsenal it had, my main tool for figuring out the content of a variable was still the alert() function.

OK, now we have firebug and the amazing Chrome Inspector. I gracefully retired alert() and gave it back its faithful role as an annoying dialog box. Now the tool for the job is the console.

The console which comes with a console object is more robust and is design just for debugging. Not only it gives you the content of the variable you are trying to figure out, but if it's an object, it gives you the list of all the properties and functions that comes with it.

So I create an object and want to check its value:

var a = {a:"hello",b:"world"};

alert(a); // "[object Object]"

console.log(a); // Object {a: "hello", b: "world"} 

Which of the two is better? If you said alert is better, I feel you brother, but you are wrong. It's time to retire it. The console that comes with Chrome or firefox comes with even more robust tools that lets you debug just like you would if you were using visual studio or some other respectable IDE.

Alert was a hack that served its purpose. The time is long due to retire it.