JavaScript ではセミコロンを追加する必要がありますか?

JavaScript のセミコロンはオプションです。セミコロンを追加するかどうかは主にコーディングスタイルの問題ですが、しばらく付けない、またはしばらく付けないでください。通常、ステートメントが "("、"["、"/"、" "、または "-" で始まる場合、そのステートメントは前の行のステートメントの一部として解釈される可能性があります。この場合、防御的にセミコロンを追加できます。

注: セミコロンは追加することも追加しないこともできますが、次の場合には追加しないでください。

コードにおけるセミコロンの役割

JavaScript には、ASI と呼ばれる自動セミコロン挿入のメカニズム (Automatic Semicolon Insertion) があります。 ECMA-262 の自動セミコロン挿入の説明 - 自動セミコロン挿入:

• 問題のあるトークンは

  }

  .

• ただし、上記のルールには追加の優先条件があります。つまり、セミコロンが挿入され、解析結果が空のステートメントである場合、またはセミコロンが挿入され、それがステートメントの先頭にある 2 つのセミコロンのいずれかになる場合です。 for ステートメントの場合、no セミコロンが自動的に挿入されます。

• 注: 上記の説明の翻訳はぎこちないので、何度か読むか、英語の原文 ECMA-262 - 自動セミコロン挿入
  ## を読んでください。

  # セミコロンの自動挿入の状況

簡単にまとめると、自動セミコロン挿入は行置換に基づいており、パーサーは次の場合に限り、新しい行を現在の行にマージしようとします。 ASI ルールを満たしています。新しい行を独立したステートメントとして扱う

主な自動挿入ルールは次のとおりです。

新しい行が存在する場合現在の行にマージすると、不正なステートメントになります。正しく解析できない場合、新しい行が

で始まるときにセミコロン

が自動的に挿入されます。

• ##return
ステートメントで終了する場合、セミコロン ## が自動的に挿入されます。

• ##break

  行の終わりの場合 ステートメントが終了すると、行末にセミコロンが自動的に挿入されます

• ステートメントが throw

  で終わる場合、行末にセミコロンが自動的に挿入されます。

• continu## で終わる場合#e ステートメントの場合、行末にセミコロンが自動的に挿入されます。

• ES6 の yield ステートメントで終了する場合、行末にセミコロンが自動的に挿入されます

• , -- サフィックス式は新しい行の先頭として使用され、行の先頭にセミコロンが自動的に挿入されます

• ソース コード ファイルの末尾に自動挿入される番号

• #上記のように、セミコロンがない場合、次のときにエラーが報告されます。このコードを実行します。 セミコロンを省略できないケース

• 通常、

  (
,

、

、 、- は、前のステートメント行の一部として解釈される場合があります。実際には、

、 、- で始まるステートメントはまれですが、(、[ で始まるステートメントは非常に一般的であり、通常は擁護できます)行の先頭に必要に応じてセミコロンを追加します。<p> 先ほど、セミコロンの自動挿入について学びました。次に、いくつかの例を見てみましょう。 </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">let hey = &amp;#39;hey&amp;#39; [&amp;#39;liu&amp;#39;,&amp;#39;liuxing&amp;#39;].forEach(console.log)</pre><div class="contentsignin">ログイン後にコピー</div></div><p> 少し上記の結果について考えてみませんか?このコードを実行すると、ルール 1 に基づいて </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">Uncaught TypeError: Cannot read property &amp;#39;forEach&amp;#39; of undefined</pre><div class="contentsignin">ログイン後にコピー</div></div><p> がスローされます。上記のコードは次のコードに解析されます。</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">let hey = &amp;#39;hey&amp;#39;[&amp;#39;liu&amp;#39;,&amp;#39;liuxing&amp;#39;].forEach(console.log)</pre><div class="contentsignin">ログイン後にコピー</div></div><p>##[##] で始まるステートメントを使用すると、次のことがわかります。 #、その前にセミコロンがないとエラーが発生する場合があります。 <code>

<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">const a = 1 const b = 2 const c = a + b (a + b).toString()</pre><div class="contentsignin">ログイン後にコピー</div></div>で始まるステートメントのコード例を見てみましょう。上記のコードの結果は "3" だと思いますか? しかし実際には、エラーをスローします

ではありません。ASI ルールに従って、次のコードに解析されるためです: <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">const a = 1;const b = 2;const c = a + b(a + b).toString()</pre><div class="contentsignin">ログイン後にコピー</div></div>1 つずつ紹介しません

, , - はステートメントの先頭として使用されます。この状況は比較的まれです。自分で試してみてください。ステートメントが (# で始まることに注意してください) ##, [ , /, , - の先頭には、ステートメントの前にセミコロンを追加する必要があります! return の使い方を見てみましょう この場合、

(() => {
  return
  {
    name: 'Liu Xing'
  }
})()

name

unknown が返されます。 では ASI が自動的に返されます にセミコロンが追加されます。コードが正しく実行されるように、ここでは正しい改行が必要です。正しいセミコロンに加えて、正しく適切な行も必要であることがわかります。

私たちは、JavaScript の自動セミコロン挿入メカニズムと、JavaScript がセミコロンを自動的に追加するタイミングについて理解しています。 # #(,

, /, , - では、先頭にセミコロンを正確に追加する必要があります。自動セミコロン挿入メカニズムには 2 つのオプションがあります, セミコロンを追加するかどうか? それはすべてあなたまたはあなたのチームの好みによって異なります. 現在では、スタイルを自動的に統一するための Prettyer、Eslint、およびその他のツールも用意されています。 [関連する推奨事項: JavaScript ビデオ チュートリアル 、基本的なプログラミング ビデオ ]

以上がJavaScript ではセミコロンを追加する必要がありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。