A few reasons to use semicolons when writing JavaScript

NAVIGATION

Visual cue for the eyes

The statement is finished

Newline has divided responsibilities

There are caveats

The semicolon is the statement ending character in many programming languages.

let counter = 0;

It's used in Java, C/C++, C#, PHP, and Perl to name a few. You can't have missed it if you have been programming for a while.

In JavaScript, however, it's not mandatory to use semicolons. A newline character terminates statements according to specific rules. Isaac Schlueter has a good recap, along with few opinionated guidelines.

There is a divide between developers on whether to use semicolons or not. There are people against it and people for it. There even exists an npm package called Standard that states the "standard" is not to use semicolons.

This is going to be a plea for the opposite. Please do use the semicolon to end a statement even though it's not mandatory. It will give you plenty of benefits. They all have to do with code readability. They contribute to code maintainability, code quality, and the number of bugs lurking in your code.

Visual cue for the eyes

When reading program code, your eyes look for visual cues to group related parts. You can achieve this by using line breaks, punctuation, white space, comments, and what have you.

Using the semicolon as a statement ending character is one of the ways to help your eyes navigate in program code.

Imagine if regular text prose had no punctuation marks. Reading a paragraph of sentences without the ending period would be painful. Try the following:

Here is a sentence without ending periods You can probably read and understand it But it doesn't mean it's really that pleasant to read Especially if there is another capitalized word like Xerox to trip you over

Not that you often write multiple program statements on one line. And, to credit Isaac, you certainly wouldn't bring all rules from the English language to programming. However, ending a statement definitely helps your eyes to see what is going on in the text.

The statement is finished

A statement expresses a basic unit of computation. It describes a set of instructions to be executed. You naturally want to end describing it and indicate that it's complete. You want to say that there are no more characters to be included in the statement. This is all there is to it. As a programmer, I am moving over to the next one. I've achieved a sense of closure.

Load contents from the file named data.txt. Period. Increment the counter by one. Period. Render the index page template. Period.

A statement ending character perfectly suits this purpose.

Newline has divided responsibilities

If no separate statement ending character is used, the role is solely left to the newline character. It has divided responsibilities, as it's not only used for representing a statement ending but also for regular formatting.

For example, object literal is best split to multiple lines for improved readability. In that case, newlines are not statement endings but only formatting. This sends mixed signals to the user, be it unconsciously or not. Does the newline end the statement, or is it just used for grouping whitespace?

There are caveats

Since semicolons are optional, the rules with newline characters take higher priority over semicolons. The following will return undefined even if you are using semicolons. It can be counted as one of JavaScript's idiosyncrasies and is best avoided.

function returnsUndefined() {
    return
        "value";
}

Use semicolons for readability but avoid these traps that stem from newline terminated statements.

Node doesn't wait for your database call to finish?

Node doesn't wait for your database call to finish?

Learn how asynchronous calls work and make your app run as you intended. Get short email course on asynchronicity and two chapters from Finish Your Node App.

Loading Comments