ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript ステートメント内の次のセミコロンの問題

JavaScript ステートメント内の次のセミコロンの問題

亚连
亚连オリジナル
2018-06-21 18:56:051806ブラウズ

この記事では、JavaScript のステートメントの背後にあるセミコロンの問題について詳しく説明します。必要な方は参考にしてください。

セミコロンを自動的に追加するための 3 つのルールがあります。 JavaScript

  1. 改行文字(改行文字を含む複数行のコメントを含む)があり、次のトークンが前の構文と一致しない場合、セミコロンが自動的に追加されます。

  2. }がある場合、セミコロンが欠けている場合は埋められます。

  3. プログラムのソースコード終了時、セミコロンが欠けている場合は埋められます。

独自の JS 構文解析ツール JSinJS (https://github.com/kissjs/JSinJS) を使用して、最初のステートメント (つまり、Statement の最初のセット) に現れる可能性のあるすべての JS 構文タグを見つけました。 、それらは:

["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 です。

また、セミコロンの前 (つまり、セミコロンを削除した後の最後のセット) に現れる可能性のあるすべての文法マーカーも見つけました。それらは合計

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

17 個です。

35*17 = 595 個の組み合わせ。記憶を容易にするために、以下のグループに分けて文法的な曖昧さについて説明します。 (もともと Excel を使用してテーブルを作成しましたが、テーブルが大きすぎて投稿できません)

まず第一に、次の構文マークで始まるステートメントは絶対に安全であり、セミコロンのない前の行とあいまいさを引き起こすことはありません:

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

次に、セミコロンを追加しないことによって生じる文法的な曖昧さをグループ化してみましょう:

  1. 1 つ目は、2 つの演算子 ++ と -- が前の行の最後に現れ、次の行が始まる場合です。以下の場合、文法的な曖昧さが発生します:

  2. function delete void typeof new null tr​​ue false NumericLiteral StringLiteral RegularExpressionLiteral ( [ { Identifier ++ -- + - ~ !

  3. その中で、function と delete は非常に一般的です

  4. 特に ++ と -- が 1 行に分割されている場合、JS の文法規則ではポストインクリメント操作では途中に改行を挿入できないと規定されているため、++ を使用します。そして -- は前置インクリメントとみなされ、その後に次の行が連結されます

  5. 2 番目のケースは、return が前の行で終わる場合です。次の行が

  6. で始まる場合です。 void typeof ( [ { Identifier ++ -- + - ~ !

  7. また、JS 文法の規則では、return と次の値の間に改行を挿入することは許可されていないため、return の後に改行文字がある限り、セミコロンとみなされ、ユーザーの期待と一致しないことがよくあります

  8. 3 番目のケースは、次の行が + と - で始まり、前の行が次で終わる場合です。文法的曖昧さ:

  9. -- ++ IdentifierName ] ) } RegularExpressionLiteral

  10. + または - で始まるステートメントがほとんどないため、この状況は危険とはみなされません。 4 番目の状況は、前の行が Break または で終わる場合です。続行すると、次の行が Identifier で始まる場合、文法的曖昧さが生じます

  11. 5 番目のタイプは、次の行が ( と [ で始まり、前の行が次で終わる場合) です。文法的曖昧さが生じます。

    -- ++ IdentifierName ] ) } RegularExpressionLiteral StringLiteral NumericLiteral BooleanLiteral NullLiteral Identifier this
  12. この状況は非常に危険です (したがって、hax の記事のステートメントの前にセミコロンを書く必要があります)。前の行のほとんどすべての状況は、通常の期待を超える結果に
  13. 6 つ目は、次の行が RegularExpressionLiteral で始まる場合、前の行の次の終わりは除算記号として理解されます:
  14. -- ++ IdentifierName ] ) } RegularExpressionLiteral StringLiteral NumericLiteral BooleanLiteral NullLiteral 識別子 this
  15. Summary 、

return、break、 continue、post-increment、および post-decrement の 5 つのステートメントでは、改行文字は完全にセミコロン。

var if do while for continue Break return with switch throw try 複数のキーワードで始まるデバッガ ステートメントと空のステートメントは、前の行にセミコロンを追加しても追加しなくても、ほとんど効果がありません。
  1. 式文や関数式文の後にセミコロンを付けないと非常に危険であり、状況が非常に複雑になります。
  2. ( と [ で始まるステートメントの前にセミコロンがない場合は、非常に危険です。
  3. 以下は、コード例を通して JavaScript のセミコロンの問題を紹介します

一般に、遅延フロントでは-end プログラム メンバーはしばしば不可解な問題に遭遇します

今日は、JS でよく発生するセミコロンに関するいくつかの問題についてのみ説明します。コンパイル時にデフォルトでセミコロンが追加されますが、特定のケースではデフォルトではセミコロンが追加されません。この場合に注意すべき点をいくつか簡単に紹介します。

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

以上がJavaScript ステートメント内の次のセミコロンの問題の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。