Trailing semicolons as Unexpected tokens so maddening

I may be old-school, but I like to put commas at the end of every javascript instruction and the fact that observable throws an “Unexpected token” error is taking the joy out of an otherwise extremely enjoyable coding experience.

Am I the only one with this problem?

The syntax error is because you are writing an expression rather than a statement. If you want to write a statement (and a trailing semicolon), then you need curly braces:

{ return 42; }

In a sense, you can think about it like writing an arrow function. It’d be weird if this were valid syntax:

() => (42;)

But this is fine:

() => { return 42; }

If we allowed a trailing semicolon for an expression cell, then you could have multiple expression statements in a single (formerly expression) cell:

1; 2; 3;

What would be the value of the cell in this case? Again, to use arrow functions as an analogy, would you expect the following function to return three or undefined? The language specifies the latter.

() => { 1; 2; 3; }

We could perhaps somehow change Observable to use completion values instead of the expression value (like eval does), but I’d wager that completion values are less well understood and harder to reason about than expression values.

We could perhaps special-case the trailing semicolon if a cell has a single expression statement, meaning we’d implicitly convert that expression statement to an expression. But this muddies the semantics of Observable’s grammar, so I think overall this change would be worse for understanding. (That said, I’m also of the opinion that JavaScript’s automatic semicolon insertion was a mistake.)

We are planning on making the error message friendlier for this case. There’s a lovely post on the Elm blog called Compilers as Assistants and we think there is much more we can do in Observable to improve the readability and actionability of our errors, warnings and hints.

2 Likes

Thank you for such an in-depth answer to a throwaway, pet-peeve post.

I do understand the logic behind it, the arrow function parallel being the most helpful. I guess I’ll just get used to it.

1 Like

What are semicolons?

The semicolon is ; and is used to indicate the end of a statement in JavaScript.