【初心者向け】JavaScriptの変数名：命名規則と無効な文字を徹底解説！
JavaScriptにおける変数名の命名規則と無効な文字
有効な文字
変数名に使用できるのは、以下の文字です。
- ドル記号 (
$) - アンダーバー (
_) - 数字 (
0から9) - 英小文字 (
aからzおよびAからZ)
例
$total_myVarmyVariable
以下の文字は、変数名に使用できません。
- 予約語（
var、function、if、elseなど） - 演算子（プラス、マイナス、掛け算、割り算など）
- 句読点（ピリオド、カンマ、セミコロンなど）
- 空白
if (age)(予約語ifが含まれている)2+num(演算子+が含まれている)total,tax(カンマが含まれている)my variable(空白が含まれている)
- 変数名は、プログラム内で既に使用されている名前と重複してはなりません。
- 大文字と小文字は区別されます。
myVariableとMyVariableは異なる変数として扱われます。 - 変数名は数字で始まってはいけません。
無効な文字を使用する理由
上記のように、JavaScriptではいくつかの文字が変数名として使用できません。これは、以下の理由からです。
- 予約語との混同: 無効な文字を使用すると、予約語と混同される可能性があり、プログラムエラーが発生する可能性があります。
- 読みづらくなる: 変数名に特殊な文字を使用すると、コードが読みづらくなり、他の開発者が理解しにくくなります。
- プログラムの動作に支障をきたす可能性がある: 無効な文字を使用すると、プログラムの構文解析エラーを引き起こしたり、予期しない動作が発生したりする可能性があります。
◎ܫ◎とが変数名として無効な理由
◎ܫ◎とは、いずれも有効な文字ではないため、JavaScriptの変数名として使用できません。
- は、Unicode文字であるため、すべてのJavaScriptエンジンでサポートされているわけではありません。
- ◎ܫ◎は、複数の文字で構成されているため、1つの文字として認識されません。
代替案
◎ܫ◎やのような特殊な文字を使用したい場合は、以下の方法で代替できます。
- Unicodeエスケープシーケンスを使用する。例えば、を
\u263Aというようにエスケープすることができます。 - 英数字とアンダーバーを使って、その文字を表す名前を付ける。例えば、◎ܫ◎を "happy_face" という変数名にすることができます。
// 有効な変数名
let firstName = "Taro";
let lastName = "Yamada";
let age = 30;
let total = 1000;
let _isStudent = true;
// 無効な変数名
// let blankVariable = " "; // 空白が含まれている
// let commaVariable = "name,age"; // カンマが含まれている
// let operatorVariable = "2 + num"; // 演算子 + が含まれている
// let reservedWordVariable = "if (condition)"; // 予約語 if が含まれている
// let startWithNumberVariable = 1number; // 数字で始まっている
// let caseSensitiveVariable = "myVar" != "MyVar"; // 大文字と小文字が区別されていない
// 有効な変数名の代替案
let happyFace = "◎ܫ◎"; // ◎ܫ◎ を英数字とアンダーバーで表現
let unicodeFace = "\u263A"; // を Unicode エスケープシーケンスで表現
変数名は、その変数が何を含んでいるのかを明確に示すものであるべきです。例えば、ユーザーの名前を格納する変数であれば、userName や firstName などの名前が適切です。逆に、x や y などのあいまいな名前は避けましょう。
一貫性を保つ
同じような種類の変数には、一貫した命名規則を使用しましょう。例えば、すべてのユーザー関連の変数には user プレフィックスを使用し、すべての商品関連の変数には product プレフィックスを使用するなどです。
長すぎない名前を付ける
変数名は長すぎると、コードが読みづらくなります。一般的には、変数名は10文字以下に抑えるのが良いでしょう。
キャメルケースを使用する
複数の単語で構成される変数名は、キャメルケースで表記するのが一般的です。キャメルケースとは、最初の単語の1文字目を大文字にし、それ以降の単語の最初の1文字目を小文字にする表記方法です。例えば、firstName や lastName などの名前がキャメルケースです。
アンダーバーを使用する
複数の単語で構成される変数名ですが、キャメルケースよりも読みやすい場合には、アンダーバーを使用することができます。例えば、user_name や product_id などの名前です。
予約語を避ける
JavaScriptには、var、function、if、else などの予約語があります。予約語は変数名として使用することはできませんので、注意しましょう。
javascript naming-conventions invalid-characters
