Maison  >  Article  >  interface Web  >  Problèmes avec le point-virgule suivant dans les instructions JavaScript

Problèmes avec le point-virgule suivant dans les instructions JavaScript

亚连
亚连original
2018-06-21 18:56:051806parcourir

Ce qui suit est une introduction détaillée au problème du point-virgule après les déclarations en JavaScript à travers cet article. Cet article vous le présente en détail. Les amis qui en ont besoin peuvent s'y référer

JavaScript ajoute automatiquement des points n° de règle, il y en a 3

  1. lorsqu'il y a un caractère de nouvelle ligne (y compris les commentaires multilignes contenant des caractères de nouvelle ligne), et le suivant le jeton ne peut pas correspondre à la syntaxe précédente, le point-virgule sera automatiquement ajouté.

  2. Quand il y a }, s'il manque un point-virgule, il sera rempli

  3. Quand le code source du programme se termine, si un point-virgule est manquant, des points-virgules seront ajoutés.

En utilisant mon propre outil d'analyse de syntaxe JS, JSinJS (https://github.com/kissjs/JSinJS), j'ai trouvé toute la syntaxe JS qui peut apparaître dans la première instruction Marks (qui c'est-à-dire la première série de Déclaration), ils sont :

["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 au total.

J'ai également trouvé tous les marqueurs grammaticaux qui peuvent apparaître avant le point-virgule (c'est-à-dire le dernier ensemble après avoir supprimé le point-virgule). Ils sont

["--", "++", "IdentifierName", "]", ")", "}", "RegularExpressionLiteral", "StringLiteral", "NumericLiteral", "BooleanLiteral", "NullLiteral", "Identifier", "this", "debugger", "return", "break", "continue"]
, soit un total de 17.

35*17 = 595 combinaisons Pour faciliter la mémoire, je discuterai des ambiguïtés grammaticales en groupes ci-dessous. (À l'origine, j'utilisais Excel pour créer un tableau, mais le tableau est trop grand pour être publié)

Tout d'abord, l'instruction commençant par la marque de syntaxe suivante est absolument sûre et ne causera aucune confusion avec la ligne précédente sans point-virgule Ambiguïté :

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

Ensuite, regroupons les ambiguïtés grammaticales causées par la non-ajout de points-virgules :

  1. La première est lorsque les deux opérateurs ++ et -- apparaissent à la fin de la ligne précédente. Lorsque la ligne suivante commence par ce qui suit, une ambiguïté de syntaxe se produira :

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

  3. Parmi eux, function et delete sont des instructions très couramment utilisées au début.

  4. Surtout lorsque ++ et -- sont divisés en une seule ligne séparément, car les règles de grammaire de JS stipulent que l'opération post-incrémentation ne permet pas d'insérer une nouvelle ligne au milieu, donc + + et -- seront considérés comme un pré-incrément et suivis de La ligne suivante est connectée ensemble

  5. La seconde est le cas où return est la fin de la ligne précédente. la ligne suivante commence par :

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

  7. Aussi parce que les règles de La grammaire JS ne permet pas d'insérer une nouvelle ligne entre return et la valeur suivante, donc tant qu'il y a un caractère de nouvelle ligne après return, il sera considéré comme ayant un point-virgule, ce qui souvent ne répond pas aux attentes de l'utilisateur

  8. La troisième est que la ligne suivante commence par + et - Dans le cas où la ligne précédente se termine par ce qui suit, il y aura une ambiguïté grammaticale :
  9. . -- ++ IdentifierName ] ) } RegularExpressionLiteral
  10. car c'est très peu de déclarations commençant par + ou -, donc cette situation n'est pas dangereuse
  11. Le quatrième est lorsque la ligne précédente se termine par break ou continue, et la ligne suivante commence par Identifier. Il y aura une ambiguïté grammaticale
  12. Le cinquième type est lorsque la ligne suivante. commence par ( et [, et la ligne précédente se termine par ce qui suit, il y aura une ambiguïté grammaticale :
  13. -- ++ IdentifierName ] ) } RegularExpressionLiteral StringLiteral NumericLiteral BooleanLiteral NullLiteral Identifier this
  14. Cette situation est très dangereuse (cette situation doit donc être mentionnée dans l'article hax écrit avant un point-virgule), presque toutes les situations de la ligne précédente entraîneront des résultats inattendus.
  15. Le sixième type est que lorsque la ligne suivante commence par RegularExpressionLiteral, la fin suivante de la ligne précédente provoquera/sera interprétée comme un signe de division :
  16. -- ++ IdentifierName ] ) } RegularExpressionLiteral StringLiteral NumericLiteral BooleanLiteral NullLiteral Identifier this
Résumé,

Dans les cinq instructions return, break, continue, post-incrémentation et post-décrémentation, le caractère de nouvelle ligne peut remplacer complètement le point-virgule.
  1. var if do while for continue break return with switch throw try debugger Plusieurs instructions de mots clés, ainsi que des instructions vides, l'ajout ou non d'un point-virgule dans la ligne précédente a peu d'effet.
  2. Il est très dangereux de ne pas ajouter de point-virgule après une instruction d'expression ou une instruction d'expression de fonction, et la situation est extrêmement compliquée.
  3. Toute déclaration commençant par ( et [ sans point-virgule devant est extrêmement dangereuse.
Les exemples suivants sont passé Introduction au code du problème du point-virgule en JavaScript

Généralement, les programmeurs front-end paresseux rencontrent souvent des problèmes inexplicables

Aujourd'hui, nous n'en discuterons que. Nous en rencontrons souvent. problèmes concernant les points-virgules dans JS. Le langage JavaScript peut omettre les points-virgules car il échouera à compiler s'il manque un point-virgule après le caractère de nouvelle ligne, mais il sera ajouté par défaut. Dans certains cas spécifiques, il n'ajoutera pas de point-virgule par défaut. . Présentons maintenant brièvement quelques éléments à noter :

Dans ce cas :

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如何实现三角箭头标注功能

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn