最初に学ぶことは、コードの基本的な構成要素です。
文(命令文)
文は、構文構造でアクションを実行するコマンドです。
私たちはすでに alert('Hello, world!') という文を見ており、これは “Hello, world!” というメッセージを表示します。
コードには必要なだけ文を含めることができ、文はセミコロンで区切ることができます。
たとえば、これは “Hello World” のメッセージを2つのアラートに分けます:
alert('Hello'); alert('World');通常、それぞれの文は別の行に書かれます。これによりコードの可読性が向上します。
alert('Hello');
alert('World');セミコロン
改行があるほとんどの場合、セミコロンは省略することが可能です。
これも動作します:
alert('Hello')
alert('World')ここで JavaScript は、改行を “暗黙” のセミコロンと解釈します。 これは自動セミコロン挿入と呼ばれます。
ほとんどのケースで改行はセミコロンを意味します。しかし “ほとんどのケース” は “常に” ではありません!
これは改行はセミコロンを意味しないケースです、例えば:
alert(3 +
1
+ 2);このコードは 6 を出力します、なぜなら JavaScript はセミコロンを挿入しないからです。もし行の終わりがプラス "+" で終わっている場合、直感的には “不完全な表現” であり、セミコロンが必要ないのは明らかです。このケースでは、それは意図した通りに動作します。
しかし本当に必要なときに JavaScriptがセミコロンを想定 “し損なう” ケースがあります。
このようなケースで発生するエラーは検出と修正が非常に困難です。
このようなエラーの具体例に興味があるなら、このコードを確認してみてください:
[1, 2].forEach(alert)角括弧 [] や forEach の意味についてはまだ考える必要はありません。それらについては後ほど勉強するので今のところ問題ではありません。ただ結果を覚えておきましょう: “1”, そして “2” が表示されます。
今、コードの前に alert を追加し、セミコロンで終わら “ない” ようにしましょう:
alert("There will be an error")
[1, 2].forEach(alert)実行すると、最初の alert だけが表示され、エラーが発生するでしょう!
しかし、alert の後にセミコロンをつけた場合はすべてうまく行きます:
alert("All fine now");
[1, 2].forEach(alert)これで “All fine now” メッセージ、そして 1, 2 が表示されます。
JavaScriptでは角括弧 [...] の前にはセミコロンを想定しません。
そのため、セミコロンは自動挿入されないので最初の例のコードは1つの文として扱われます。
エンジンは次のように解釈しています:
alert("There will be an error")[1, 2].forEach(alert)しかし、本来は1つではなく2つの文であるべきです。今回のケースのようなマージは間違っているのでエラーです。このようなことが起こる状況は他にもあります。
改行によって文が分割されるとしてもセミコロンを置くことを推奨します。このルールはコミュニティで広く採用されています。改めて留意しましょう – ほとんどの場合、セミコロンは除くことが 可能 です。しかし、特に初心者はセミコロンを使う方が安全です。
コメント
時が経つにつれて、プログラムはどんどん複雑になります。起こることと、なぜを説明するために コメント を追加し始める必要があります。
コメントはスクリプトのどの場所にも書くことができます。エンジンはそれらを無視するので、実行には影響しません。
1行のコメントは、2つのスラッシュ文字 // から始まります。
残りの行はコメントです。それは行全体または文に従います。
このようになります:
// この行全体がコメントになります。
alert('Hello');
alert('World'); // このコメントは文の後に続いています。複数行のコメントはスラッシュとアスタリスク /* で始まり、アスタリスクとスラッシュ */ で終わります。
このようになります:
/* 2つのメッセージを含む例。
これは複数行のコメントです。
*/
alert('Hello');
alert('World');コメントの内容は無視されます、そのため、/* … */ の中にコードをおいても実行されません。
これはコードの一部を一時的に無効にしたいときに便利です:
/* コードのコメントアウト
alert('Hello');
*/
alert('World');ほとんどのエディタでは、コードの行は1行コメントとして Ctrl+/ ホットキーによりコメントアウトすることができます。そして Ctrl+Shift+/ で複数行コメントです(コードの一部を選択し、ホットキーを押します)。 Macでは、 Ctrl の代わりに Cmd を試してください。
別の /*...*/ の中に /*...*/ はありません。。
このようなコードはエラーになります。
/*
/* nested comment ?!? */
*/
alert( 'World' );コードにコメントするのを躊躇わないでください。
コメントはコード規模を増加させますが、それは全く問題ではありません。プロダクションサーバへリリースする前にコードを minify する多くのツールがあります。それらはコメントを除去するので、実行されるスクリプトには現れません。そのため、コメント書くことによるネガティブな影響は全くありません。
さらにこのチュートリアルでは、より良いコメントの書き方を説明するチャプター コーディングスタイル もあります。