Question

I come from Java Background and so used to Debugging using Eclipse but have recently started on JavaScript(jQuery in particular) and am having really hard time debugging JavaScript Code so my question is

What are the best ways of Debugging JavaScript ?

I have tried using Firebug and it is good, but wanted to know

If we have any other useful tools or stratergies for Debugging JavaScript ?

Answer 1

I’ve recently switched from Firebug to Google Chrome as it has some pretty powerful debugging tools built-in (Ctrl+Shift+J to get the Developer Tools window open), including break-points.

I’ve also used logging/tracing to great effect. Some examples:

• When the code runs without syntax errors but does not do what I expect, I can log messages (e.g. “here1”, “here2”, etc.) to the console to see what is going on (can also be done by stepping through with the debugger, but that may be harder if your logic is in some crazy loop or something that takes a while to step through).
• When the blocking nature of an alert box or breakpoint would break the code I’m debugging. This happens a lot when I have multiple timer intervals set. Alert boxes are also painful to use in long loops (and breakpoints can be too).
• When I want to see what value a certain variable has at one point in the code. If it’s a one time thing, then breakpoints are great for this (better, even, because I can check the value of any variable in that context), but if that code is being executed often and I only care about, say, the third time it’s executed after I click on a certain link, then logging is very helpful. I can ignore the output I don’t want (or clear if it’s in the way) and concentrate only on the output I’m interested in.