1. Technology

Semicolons and JavaScript

By

One aspect of the original design of the JavaScript language that was meant to make things easier but in fact causes problems relates to semicolons.

In JavaScript each statement is supposed to end with a semicolon however JavaScript allows the semicolons to be omitted provided that the statement ends with a new line character.

There are several ways in which this can cause problems.

The most obvious way in which this causes problems is where you omit the semicolons and then decide to make the code smaller by removing the linefeeds. Where there is a semicolon missing on the end of a statement and you remove the linefeed on the end of the statement without adding the semicolon you will end up with code that makes no sense and the JavaScript will refuse to run.

While adding the semicolon fixes this problem it is not always obvious where some statements end that require a semicolon to be added. This is particularly true where the statement itself contains {}. The following is a single statement which requires a semiconon on the end if it is to be followed on the same line by another statement.


window.onload = function() {...}

Note that where {} is used to enclose a block of statements that is not a part of another statement does not require a semicolon following the }. Of course placing a semicolon there will still work in most instances as all that does is to add an extra statement that does nothing following the block and so as long as it is valid to have a statement there, adding the semicolon will only have the effect of making the code slightly longer.

That JavaScript does not require the semicolon to terminate a statement when the statement ends at the end of a line also makes it more difficult with regards to statements which can and cannot extend over multiple lines. Because the semicolons can be omitted the spot in a statement where you place the linebreak can make the difference between whether the code is considered to be one statement or two. For example a return statement must always have the value to be returned start on the same line as the word return. The following is a single statement.


return {
...};

The following is two separate statements where the second (the {} block) never gets run.


return
{...};

This is because return by itself can be interpreted as a complete statement and so the linefeed at the end of the first line is considered to be the end of a valid statement and so the assumed semicolon to end the statement is added.

This semicolon issue means that it is possible to break JavaScript code by combining lines together and also to break the JavaScript by splitting lines apart in the wrong place.

There is no guaranteed solution to ensure that your JavaScript will be interpreted the way you intend due to the way that JavaScript assumes the missing semicolons on the end of statements.

Following a consistent standard in the way that you set out your JavaScript is the best that you can do to try to minimise the possibility of errors in your code as a result of this. Some suggestions on how to best do this include always including the semicolon on the end of your statements and always placing the { that is within a statement on the end of the first line rather than placing it on a separate line.

  1. About.com
  2. Technology
  3. JavaScript
  4. Problem Solving
  5. Semicolons and JavaScript

©2014 About.com. All rights reserved.