How to find Javascript syntax errors?

Viewed 95042

I am writing a JavaScript section of code and making huge amounts of silly mistakes in the syntax. But the only way to find what line the error is on is to start commenting out the section of code I just wrote and reload it into the browser to narrow down where my missing ');' is.

How do you "compile" a JavaScript source to make sure it is syntactically correct so that I can debug it in the browser?

11 Answers

Ctrl + Shift + J in firefox, if you don't catch your mistakes until runtime. Of course firebug works better, but this is a quick way.

http://www.javascriptlint.com/

Here are some common mistakes that JavaScript Lint looks for:

  • Missing semicolons at the end of a line.
  • Curly braces without an if, for, while, etc.
  • Code that is never run because of a return, throw, continue, or break.
  • Case statements in a switch that do not have a break statement.
  • Leading and trailing decimal points on a number.
  • A leading zero that turns a number into octal (base 8).
  • Comments within comments.
  • Ambiguity whether two adjacent lines are part of the same statement.
  • Statements that don't do anything.

Try JSlint

It's a great utility for debugging Javascript. If you're using the jQuery library, there is a plugin being developed and was just recently released, similarly called jQuery Lint

One idea would be to use Firebug console for interactively experimenting with you scripts and then moving only the tested parts into the your code.

The Eclipse IDE (with the JSEclipse plugin) identifies nearly all of our syntax problems.

I suggest one of the better editors is IntelliJ, but it's not free.

If you are using Textmate (mac) you can install this bundle

It is mainly jslint, that will check your JS syntax.
And it contains some other goodies like various compression tools

Javascript is run by the browser. I'm not sure there are are 'compilers' so to speak.

One thing you could try is Firefox with Firebug addon installed. You can easily refresh the page, get error listing, including line numbers, etc. Easy way to debug.

Also - If you are willing, using Visual Studio 2008 (or the free web developer version) gives you Javascript intellisense, including jQuery support. This will help you immensely in keeping your code clean as you go.

Related