JavaScript

コード記述のルール

　JavaScriptの記述ルールについて見ていきます。

• 大文字小文字の区別
• 全角半角の区別
• 空白文字
• 文と文の区切りのセミコロン

大文字小文字の区別

　JavaScriptでは、大文字・小文字を厳密に使い分ける必要があります。一例を挙げると、変数を宣言（使用）するときに let というキーワードを使いますが、これはすべて半角の小文字でなければなりません。例えば、次の例では、２つの文で意味が変わるため、注意が必要です。

<script>
	let hello = "hello";    // これ（let）は変数hello が宣言される
	Let bye = "goodbye";    // これ（Let）はエラーが発生する
</script>

　また、変数を宣言する際の変数名も大文字・小文字が区別されるので注意してください。例えば、次の２つの変数は、それぞれ異なるものとみなされます。

<script>
	let val = "これは小文字の変数名です。";
	let VAL = "これは大文字のため、小文字の変数とは異なる変数とみなされます。";
</script>

全角半角の区別

　プログラムのコードは、基本的に半角文字を使って記述します。ダブルクォート（"）で囲まれた文字列などの一部例外を除き、プログラム内で全角文字を使用することはありません。変数名では全角文字を使用できますが、不要なバグを招くため、文字列以外は半角英数字で記述するようにしたほうが良いようです。また、コードにスペースを挿入するときも、全角スペースではなく、半角スペース、またはタブを使うようにしてください。

<script>
	let greeting = "半角英数字でコードは記述しましょう。";
	ｌｅｔ　ｇｒｅｅｔｉｎｇ = "ｌｅｔが全角のためエラー";    // これ（ｌｅｔ）はエラーが発生する
</script>

空白文字

　JavaScriptでは、基本的に空白文字（半角スペースやタブ、改行）は無視してコードが実行されます。そのため、コードを読みやすくするために、文の先頭を字下げする目的で、半角スペース等を挿入して記述するのが一般的です。

　例えば、変数宣言に使用する let と変数名の間には半角スペースやタブ、改行のどれを使っても問題なく動作します。次の例では、let の前に半角スペース（５つ）、変数名 val2 と = の間にタブを挿入し、さらに改行を使用して、１つの式を記述しています。

<script>
     let val2 	 = 
1;                  // let val2 = 1; として解釈されるため、問題なく動作する
</script>

文と文の区切りのセミコロン

　JavaScriptでは、一般的に文と文を区切るため、文末にセミコロン（;）を付けます。次の例では、window.alert関数を使用した２つの文を記述しています。

<script>
	window.alert("hello world");
	window.alert("goodbye world");
</script>

　しかし、JavaScriptの場合、文と文を改行して別の行に記述すれば、文末のセミコロン（;）を省略できます。そのため下記の場合でも、上記と同様に問題なくコードが実行されます。

<script>
	window.alert("hello world")
	window.alert("goodbye world")
</script>

　JavaScriptを学習中の初心者は、文末のセミコロンを省略しない方が、プログラム中にバグが混入しにくくなり、余計なトラブルにならずに済みます。最近では、文末のセミコロンを省略する記法を採用する開発者もいますが、省略できない記述パターンもあるため、初心者は文末にセミコロンをつけるのが良いでしょう。

　ここでは、セミコロンを省略する際の注意点も説明しておきます。

文末のセミコロンの注意点

まず、文末にセミコロンをつける場合には、次のように複数の文を１行で記述できます。

<script>
	a = 1; b = 2;
</script>

　この場合には、文の終わりを意図的に示す必要があるため、セミコロンを省略できません。

　一方、a = 1 という文だけであれば、以下のように記述することもできます。

<script>
a
=
1
</script>

　このように記述した場合には、JavaScriptエンジンはコードの記述方法として妥当（解釈可能）な限り、改行を無視して１つの分（この場合は a = 1）としてコードを実行します。

　また、return や break、continue というキーワードを使う場合は、改行を挟むとセミコロン（;）が挿入されているものとして自動的に判断されて実行されます。

　例えば、次の例は、自作の関数fn1 と fn2 です。この２つの関数では、実行結果が異なります。

<script>
	function fn1() {
		return 1     // 改行していない場合
	}
	function fn2() {
		return
		1            // 改行している場合
	}
	
	fn1()            // fn1関数の実行結果は 1
	fn2()            // fn2関数の実行結果は underfined
</script>

　fn2の場合、JavaScriptエンジンは return を return; と解釈し、return に続けて戻り値（関数が返す値：ここでは 1）が設定されていないと判断します。そのため、return 1 のように、改行をはさまずに記述したときと実行結果が変わってきます。function や underfined などの意味については、別途説明しますので、ここでは結果が異なることだけ押さえておいてください。

　このように、セミコロンを省略すると意図しない動作になる場合があるため、JavaScriptを学習中の初心者はセミコロンをつけて書くようにしましょう。