JavaScriptの変数と定数を知ろう【JavaScriptの書き方入門】

JavaScriptに限らず、プログラミングの学習ではほぼ必ず登場する「変数」。
変数の概念と、JavaScriptでの使い方を学習しましょう。

• 変数と定数
• 変数・定数の種類と書き方
• 変数・定数を組み合わせる
• 変数の命名とNGワード

変数と定数

プログラミングにおける変数とは「箱」のことを指します。
この箱には名前をつけ（変数宣言）、中身を入れることができます。

これをJavaScriptでは下記の形で書きます。

変数とよく似たものに「定数」というものがあります。
仕組みはほぼ同じですが、変数は変更できるのに対して、定数は一度決めた値（中身）を変更することはできないという違いがあります。

本講座では、値を上書きする必要がない部分は定数（const）を使って進めていきます。

変数・定数の種類と書き方

変数・定数には数字だけではなく、文字を入れることもできます。

ただし、文字は文字列（言葉）であることを示すために、引用符で囲むというルールがあります。引用符はシングルクォーテーション、ダブルクォーテーションどちらでも良いです。

これだけだと、引用符で囲む必要性がイマイチわかりませんよね。

変数同士は計算したり、組み合わせて表示することもできます。
その方法と合わせて、引用符で囲む意味も見てみましょう。

変数・定数を組み合わせる

変数や定数を合体して表示させる際には、+を使います。
test.jsなどを使って試してみて下さい。

3も5も数（数値）なので、3+5の結果＝8が表示されました。

文字列「です」が中身の定数Cを作って、更に足してみましょう。

3+5のように足し算はできないので、「です」は横に並んで表示されます。
「です」に引用符がない場合は認識されず、スクリプトは実行されません。

では、反対に、数字の部分を引用符で囲うとどうなるでしょう？

定数Bの「5」は数字（数値）ではなく文字であると認識されました。
文字と数値では計算できないので、35と横並びに表示されています。
電話番号や日時、年齢など計算されたくない数字は引用符で囲うと良さそうですね。

変数の命名とNGワード

変数・定数の名前に使用できる文字は下記のとおりです。

• 英字「a～z、A～Z」
• 数字「0～9」
• _（アンダースコア）

この文字記号のみを使っていれば、名前は好きにつけることが出来ます。
ただし、数字から始まる名前はNG。
○：lesson1
✕：1lesson

また、「予約語」と呼ばれる変数名に使えないワードがいくつかあります。
予約語は、JavaScriptが何らかの処理に使用しているキーワードのようなもの。ですので、変数名にしてしまうとエラーになってしまいます。

予約語は“ECMAScript”仕様書によって決められています。
バージョンによって予約語には変動がありますが、ECMAScript 7の場合は下記のとおりです。

予約語や調べ方は下記サイトが参考になります。
興味のある方は調べてみてください。

外部リンク

【JavaScript】 予約語一覧と使用できるパターン