HomeBlogCategory: “js2-mode”

Showing only posts in category “js2-mode”.

Show all


On Automatic Semicolon Insertion

(this started as a reply to this thread in NodeJS, but it got rather long so I'm posting it here)

Before doing JavaScript, I was doing C/C++. There semicolons were required, and you got an error from the compiler when they were missing. I rarely got such errors though because when a semicolon was missing, Emacs would indent badly the following line; bad indentation was always a sign of syntax errors.

So when I moved to JavaScript, semicolons at end of statements made very much sense. The Emacs JS options at that time weren't nearly as good as the C/C++ mode, so sometimes I forgot the semicolon.  Although usually the program ran fine, I still went through all sorts of scary bugs because of the automatic semicolon insertion. Oh how I missed that compiler error!

So I got quite religious about using semicolons (also because I was using a simple regexp-based scanner to minify JS, and that was easily screwed by missing semicolons). Nowadays I use Emacs with js2-mode, which contains a full JS parser, and is able to warn about various things during editing, such as missing semicolons.

As a matter of taste, I find code that uses semicolons at the beginning of lines a bit silly:

;(x || y).doSomething()
;[a, b, c].forEach(doSomething)
for (var i = 0; i < 10; i ++) {

I'm doing a lot of Lisp hacking lately, and the first two lines look like comments to me (intentionally turned off syntax highlighting above).

Using the comma at BOL looks a bit better, because it makes it possible to comment out the line without forgetting a trailing comma:

var magicWords = [ "abracadabra"
                 , "gesundheit"
                 //, "ventrilo"

but still (continuing paste from npm's coding style):

  , spells = { "fireball" : function () { setOnFire() }
             , "water" : function () { putOut() }

you can't comment out the spells = line in the same way, because it spans multiple lines. So this argument fades away and let's just say it looks silly.

So as far as my advice goes:

  1. Use an editor with good JS support. If it's just decent, it doesn't qualify. GEdit is decent, but not good enough. Emacs is supremely great.

  2. Configure your editor to warn you about “poor practice”. Again, in Emacs it's possible to do that. For example, my setup warns me if I assign to a variable that's not defined (creating globals is almost always a source of errors), if I forget semicolons, or if I assign in a conditional (where most likely the case is that you want "==" instead of "="). Details on my setup here.

  3. Do insert semicolons and save yourself from the pain of debugging "automatic semicolon insertion".

  4. Be happy. ;-)


Editing JavaScript with Emacs — js2-mode

I wrote about this topic before.  My small hackish mode attracted a few people for its good indentation, but it still had some issues that were hard to track down.  In short, it's quite impossible to use c-mode's indentation.

In the last few days I played with Steve Yegge's excellent js2-mode and I'll write about my setup here.  js2-mode is different from most other programming modes that you can find in Emacs (and in any other editor for that matter), because it employs a full, solid parser of the language.  Instead of guessing the syntax with buggy regexps, js2-mode actually parses your code into an abstract syntax tree (AST) and can therefore provide complex information about it, not to mention very good syntax highlighting.  For example, js2-mode can and does warn you about syntax errors such as misplaced parens, or missing semicolon, or trailing comma.  Or about undeclared variables — a ”must have” with JavaScript, since it's usually the source of many subtle bugs.

I noticed this excellent mode about an year ago, but indentation was simply unbearable so this is why I didn't use it.  But now I decided to give it a second try.  Indentation can be fixed.

[ read full story... ]



This is a minor mode that I wrote on top of js2-mode which automatically highlights all occurrences of the variable under the cursor within its defining scope.  I once saw this at a friend who was using Eclipse, and I thought it's pretty cool.  With the powerful API that js2-mode exposes, it was pretty easy to write it, even despite my limited (E)Lisp experience.

[ read more... ]

See also