Problems with the following semicolon in JavaScript statements

The following is a detailed introduction to the semicolon problem behind statements in JavaScript through this article. This article introduces you to it in great detail. Friends who need it can refer to it.

JavaScript automatically adds points No. rules, there are 3

1. when there is a newline character (including multi-line comments containing newline characters), and the next token cannot match the previous syntax , the semicolon will be automatically added.

2. When there is }, if a semicolon is missing, it will be filled

3. When the program source code ends, if a semicolon is missing, Semicolons will be added.

Using my own JS syntax analysis tool JSinJS (https://github.com/kissjs/JSinJS), I found all the JS syntax that can appear in the first statement Marks (that is, the first set of Statement), they are:

["debugger", "try", "throw", "switch", "Identifier", "with", "return", "break", "continue", "for", "while", "do", "if", "new", "function", "(", "{", "[", "RegularExpressionLiteral", "StringLiteral", "NumericLiteral", "BooleanLiteral", "NullLiteral", "this", "!", "~", "-", "+", "--", "++", "typeof", "void", "delete", ";", "var"]

35 in total.

I also found all the grammatical markers that can appear before the semicolon (that is, the last set after removing the semicolon). They are

["--", "++", "IdentifierName", "]", ")", "}", "RegularExpressionLiteral", "StringLiteral", "NumericLiteral", "BooleanLiteral", "NullLiteral", "Identifier", "this", "debugger", "return", "break", "continue"]

, a total of 17.

35*17 = 595 combinations. In order to facilitate memory, I will discuss grammatical ambiguities in groups below. (Originally I used Excel to make a table, but the table is too big to post)

First of all, the statements starting with the following syntax tags are absolutely safe and will not cause any confusion with the previous line without a semicolon. Ambiguity:

var if do while for continue break return with switch throw try debugger ;

Next, let’s group the grammatical ambiguity caused by not adding semicolons:

1. First The first is that the two operators - and - appear at the end of the previous line. When the next line begins with the following, syntax ambiguity will occur:

2. function delete void typeof new null true false NumericLiteral StringLiteral RegularExpressionLiteral ( [ { Identifier -- - ~ !

3. Among them, function and delete are very commonly used statements at the beginning.

4. Especially and When -- is broken into one line alone, because the syntax rules of JS stipulate that the post-increment operation does not allow inserting a newline in the middle, so and -- will be regarded as the pre-increment and connected with the next line.

5. The second case is return as the end of the previous line. When the next line starts with the following, grammatical ambiguity will occur:

6. function delete void typeof ( [ { Identifier -- - ~ !

7. Also because the rules of JS grammar do not allow inserting a newline between return and the following value, so as long as there is a newline after return, it will be regarded as valid. number, which is often inconsistent with the user's expectations.

8. The third is the situation where the next line starts with and -, and the previous line ends with the following, which will cause grammatical ambiguity:

9. -- IdentifierName ] ) } RegularExpressionLiteral

10. Because there are few statements starting with or -, this situation is not considered dangerous.

11. The fourth situation is when the previous line ends with break or continue, and when the next line starts with Identifier, there will be grammatical ambiguity.

12. Five cases are when the next line starts with ( and [, and the previous line ends with the following, which will cause grammatical ambiguity:

13. -- IdentifierName ] ) } RegularExpressionLiteral StringLiteral NumericLiteral BooleanLiteral NullLiteral Identifier this

14. This situation is very dangerous (so hax’s article should mention this situation and write a semicolon before the statement). Almost all situations in the previous line will lead to unexpected behavior. result.

15. The sixth is that when the next line starts with RegularExpressionLiteral, the following ending of the previous line will cause/be interpreted as a division sign:

16. -- IdentifierName ] ) } RegularExpressionLiteral StringLiteral NumericLiteral BooleanLiteral NullLiteral Identifier this

Summary,

1. In the five statements of return, break, continue, post-increment, and post-decrement, the newline character can completely replace the semicolon.

2. var if do while for continue break return with switch throw try debugger Statements starting with several keywords, as well as empty statements, adding or not adding a semicolon in the previous line has little effect.

3. It is very dangerous not to add a semicolon after any expression statement or function expression statement, and the situation is extremely complicated.

4. Any statement starting with ( and [ without a semicolon in front of it is extremely dangerous.

The following examples are used Code introduction to the semicolon problem in JavaScript

Generally, lazy front-end programmers often encounter some inexplicable problems.

Today we will only discuss the We often encounter some problems about semicolons in JS. The JavaScript language can omit semicolons because it will not compile if there is a missing semicolon after the newline character. It will add a semicolon by default, but in In some specific cases, he will not add a semicolon by default. Now let’s briefly introduce a few things that need to be paid attention to.

In this case:

var x = 0
[x+1,x+2,x+3].forEach(function(){
console.log(x)
})

这种情况下会导致程序无法正常运行。JavaScript在解析这段代码是并不会在var x = 0后换行。
在写代码时如果以一条语句以 ”(” ，"[" ，"+" ，"-" ，"/" 开始时通常在上一条语句不会默认添加分号的。所以在这种情况下尽量保持一下这种写法，在以这些字符开始时在行首添加一个分号，这样可以保证在别人更改上面代码时不加分号也不会影响以下代码运行。

var x = 0
;[x+1,x+2,x+3].forEach(function(){
console.log(x)
})

还有就是在涉及 return break continue 这种语句时尽量不要换行

return 
true;
JavaScript会解析为
return; true;
在涉及  ++  和  --  这一系列运算时 在作为表达式的前缀或后缀时在换行是会有一定的问题，如下情况:
var x = 0;
var y = 0;
x
++
y

JavaScript会解析为

x;++y;      而不是    x++;y;

虽然在JavaScript这门语言中  “;”  是可以省略不写的，但是还是建议大家每句代码后都跟上  “;”  养成这种良好的编码习惯，毕竟在大多语言中不带  “;”  的编码适不适用的。

上面是我整理给大家的，希望今后会对大家有帮助。

相关文章：

在JavaScript中如何判断变量名是否存在数组中

通过JS如何实现延迟隐藏功能

使用Angular如何实现定时器功能

使用Angular如何实现三角箭头标注功能

The above is the detailed content of Problems with the following semicolon in JavaScript statements. For more information, please follow other related articles on the PHP Chinese website!