JavaScript: Semicolon Rules

By Xah Lee. Date: . Last updated: .

There are 2 schools of thought on semicolon. The old school, recommend to add semicolons. The new school, becoming more popular after 2015, recommend omitting semicolons.

This page shows the rules of each school, and details on why.

Omit Semicolon School

Here's rules if you want to omit semicolon:

  1. Do not use semicolon, except:
  2. A Line should never start with parenthesis () or square bracket []. If so, add a semicolon in the beginning of line (or end of previous line).

Watch this short video for excellent explanation.

Are Semicolons Necessary in JavaScript? by Kyle Robinson Young.

Add Semicolon School

Here's rules if you want to use semicolon:

ALWAYS add semicolon after expression at top-level. For example:

  1. var x = …;
  2. var x = function () {};
  3. (function () { … }()); (immediately invoked function expression.)

The following does not require semicolon:

A redundant semicolon is a empty statement. Extra semicolon won't hurt normally, but is not allowed when expression are expected, such as in function argument.

Using Semicolon in Practice

Here's code examples explaining JavaScript behavior as if without the “Automatic Semicolon Insertion”.

Variable Assignment

Always use semicolon at end of variable assignment.

var x = 4; // ← add semicolon

var y = {p1:1, p2:2}; // ← add semicolon

var f = function() { return 3; }; // ← add semicolon

Function Declaration

For function declarations, no need semicolon.

// function declaration
function f1() {
    // ...
} // semicolon not required here

Function as Argument

When using function expression as a argument, you must not have semicolon. Example:

// function expression as argument, semicolon not allowed
    function () {
        // ...
    } // ← semicolon not allowed 

Last Statement Inside a Function Definition

return statement requires a semicolon.

function ff() {
    return 3; // ← semicolon is technically required here

No Multi-Line Return Statement

Never have a return statement by itself on a line.

// bad
function ff() {

// this is bad. JS will add a semicolon at end of return.
// so the function will just return undefined

console.log(ff()); // undefined

Function Call

A function call, returns a expression.

// function call

(function () {
    return 3;
})(); // better add semicolon here

Top level expressions should end with a semicolon.

Example of Bad Omitted Semicolon

// you intended to assign the first function, and eval the second

// js compiler tried to feed the second function as arg to your first function

var f = function() {
    return 3;
} // bad semicolon omission

(function() {
    return 4;

// compiler error

// /home/jane/test.js:7
// })();
//   ^

// TypeError: (intermediate value)(...) is not a function
//     at Object.<anonymous> (/home/jane/test.js:7:3)
//     at Module._compile (module.js:434:26)
//     at Object.Module._extensions..js (module.js:452:10)
//     at Module.load (module.js:355:32)
//     at Function.Module._load (module.js:310:12)
//     at Function.Module.runMain (module.js:475:10)
//     at startup (node.js:117:18)
//     at node.js:951:3

Semicolon Rule

Certain ECMAScript statements (empty statement, let, const, import, and export declarations, variable statement, expression statement, debugger statement, continue statement, break statement, return statement, and throw statement) must be terminated with semicolons. Such semicolons may always appear explicitly in the source text. For convenience, however, such semicolons may be omitted from the source text in certain situations. These situations are described by saying that semicolons are automatically inserted into the source code token stream in those situations.

[ES2015 §ECMAScript Language: Lexical Grammar#sec-automatic-semicolon-insertion]

Rules of Automatic Semicolon Insertion

ES2015 §ECMAScript Language: Lexical Grammar#sec-rules-of-automatic-semicolon-insertion

Why is JavaScript Semicolon Rule So Complex?

  1. JavaScript the language spec has complex syntax involving semicolon. It's not simply “add semicolon after statement”, because what's a “statement” isn't simple.
  2. But JavaScript the spec also specifies a “Automatic Semicolon Insertion”, which specifies how the compiler should automatically add a semicolon when there's a syntax error.

Ok, so, the JavaScript compiler automatically add semicolons, great, end of story, right?

No, because:

JavaScript syntax isn't systematic. The automatic semicolon insertion is not capable of covering it up.

you ends up not having a easy-to-understand or consistent way for human to know what situations a semicolon is needed.

So, there are 2 ways to think about semicolon.

① think of JavaScript as if it does not have the “Automatic Semicolon Insertion” feature. In this way, you are writing JavaScript in the “REAL” JavaScript syntax. This is the thinking of people who prefer adding semicolon.

② think of JavaScript as what happens in the end. This is the thought of omitting semicolon.

Who Recommends Semicolon?

Who Omits Semicolon?

The style library 163 thousand downloads per month as of 2016-05-14, do not recommend semicolon. by JavaScript expert Feross Aboukhadijeh.

Famous Semicolon War

javascript semicolon war 2012 crockford vs fat
JavaScript semicolon war, 2012, Douglass Crockford vs fat (twitter engineer)


ES2015 §ECMAScript Language: Lexical Grammar#sec-rules-of-automatic-semicolon-insertion

Like what you read? Buy JavaScript in Depth
or, buy a new keyboard, see Keyboard Reviews.