Don’t use Semicolons in TypeScript! //;

Eugen Kiss
4 min readJul 16, 2018

--

“Just use semicolons. It’s a little thing and makes code safer.” NO! The fact that people get worked up about semicolons shows that it’s not a trivial matter. Semicolons are not free and they do not make code safer. They are unnecessary in TypeScript and here’s why.

Your time is over, semicolon!

Semicolons in JavaScript are optional due to Automatic Semicolon Insertion (ASI). TypeScript follows ASI, too. ASI is not straightforward and there are a few situations where omitting a semicolon will lead to an unexpected runtime error. But the few corner cases in JavaScript are further eliminated by TypeScript’s type system. Consider the following example:

The ['purple', 'red'] part (line 18) is interpreted as a comma expression. In JavaScript you’ll get a run-time error. In TypeScript you’ll get a compile-time error (TS2695: Left side of comma operator is unused and has no side effects).

The handful of similar cases where I needed to add a semicolon to correct the program, TypeScript complained as it couldn’t type the program.

You can still construct hypothetical cases where even with TypeScript the program will fail only at runtime:

In both JavaScript and TypeScript you’ll get a runtime error (TypeError: log is not a function).

Add no-unexpected-multiline to TSLint.

Then the previous example will fail at compile-time, too.

Just prefix lines starting with [, (, or ` with a semicolon. But you don’t even have to remember this since TypeScript and TSLint will save you.

The examples have been taken from Olli Ahonen’s “Should I use Semicolons in TypeScript”:

Advantages

Programming is a cognitive demanding task. It also requires motor skills. Consider the process of writing, editing and reading code, and how your tooling (IDE) plays along.

  • Your IDE bothers you less (‘semicolon missing’). Less distraction!
  • Cursor navigation, mouse pointing, is easier as you don’t have to “jump/target over or before” the semicolon.
  • Less typing.

Common Counter Arguments

Here I list counter arguments and my thoughts on them.

Better safe than sorry!

What risk are you preventing? How often do you start a line with [? You still have to think about special cases from ASI even with semicolons. And you pay with a redundant character for every line. A small price for a single line but a big price for the whole code base. Plus, as shown here, you are safe with TypeScript and TSLint.

You need to remember complicated rules if you omit semicolons!

Even when you use semicolons you still need to be aware of special cases. It is easier to remember when a semicolon is required vs. when it is not. Plus, as shown here, you don’t even have to remember anything if you use no-unexpected-multiline.

You need to remember complicated rules if you omit semicolons due to new experimental language features whose ASI hazards are not yet properly known! Class Fields Example, ASI Hazard Clause

This only becomes an issue when you write esoteric code. It’s a hypothetical risk. It’s easier to not do it (because you have to write such code deliberately) than to use semicolons everywhere.

If you are not in an environment with TypeScript and TSLint (JSBin) you will be bitten by missing semicolons again!

The risk is already very low in pure JavaScript. Are you hosting your business critical code on JSBin? Why should you optimize for environments that you use only rarely instead of optimizing for the environment you use all the time? The argument blows up a miniscule risk.

Semicolons provide a visual cue which makes code easier to read!

What about the new line? Isn’t the new line cue enough? Admittedly, Python requires a technically unnecessary colon after if statements. The given reason is readability. But in that case it’s about indentation. And Python doesn’t use semicolons to terminate lines. Ultimately, there’s no accounting for taste but that doesn’t make it a strong argument in favor of semicolons.

Code is more explicit and clear with semicolons!

Doesn’t convince me. I claim code’s clearer without semicolons. Other languages are doing fine without semicolons. Many of their users even show genuine enthusiasm about being freed from the burden of semicolons.

Not using semicolons is bad for tools like transpilers and minifiers!

Code is for humans to read and write. If a tool parses the code differently from the standard, then the tool is broken. Plus, nowadays this problem doesn’t exist anymore—it’s a ghost from the past.

Conclusion

Use TypeScript (with no-unexpected-multiline) and safely omit semicolons.

You don’t have to remember any rules. The tooling will remind you in the rare case you need to prefix a line with semicolon. Semicolons are not free. Free yourself from their tyranny. //;

Update: Nowadays, I’m only using prettifier with the semi: false option. Together with an IDE extension to auto-format on save it makes editing faster as you can be messier.

Sources

If you enjoyed this article, please recommend and share it! 🙂

Retweeting is a great way to share:

--

--