JavaScriptで変数名を宣言する方法/varの使い方

content-marketing IT

JavaScriptでの変数の宣言の仕方を解説しています。予約語、変数の型についても言及します。

スポンサーリンク

変数とは

たとえば、数字を1から1000まで表示しながら数えるようなプログラムがあったとします。
1から始めて、数字に1ずつ足していき、もし数字が1000になったらそこで止めます。
もし変数を使わないと、この式は「1を表示」「表示されている数字が1なら数字を2にして頭に戻る」「表示されている数字が2なら数字を3にして頭に戻る」を1000まで書き連ねる形になります。
変数を使うと、この式は「現在の数字に1を足して表示。もし数字が1000なら式を終える、そうでなければこの処理を繰り返す」になります。
書く量は上の式は1000行ぐらい、下の式は5~6行ぐらいです。一例ですが、どう便利かおわかりになるかと思います。
この「現在の数字」にあたるのが変数で、変化する値を入れておくための入れ物です。

変数の使い方

変数の宣言
var 変数名;

名前は半角英数字/下線(_)/$記号を使っていれば「基本的に」なんでもいいです。基本的でないのが何かは後で書きます。
たとえばxという名前を付けて、それに1を代入する場合。

var x;
x = 1;

このxに最初から「1」という数字を代入しておく場合は、

var x = 1;

などと書きます。数字の場合はそのまま半角で書けばOKですが、文字を代入する場合は”で囲みます。

var x = '文字';

同時に複数宣言することも可能です。

var x,y,z;

変数宣言で使えない言葉(予約語)

「基本的」でないケースについてです。まず、ルールとして変数名の頭には数字を使えません。
また、使ってはいけない言葉が決められています。例えば上の「もし1000なら処理を終了」は

if (x == 1000);

というようにifという記号を使いますが、この「if」を変数名として使うことができません。

if (if == 1000);

↑これはダメです。訳わからなくなるからです。
このように予めプログラム側で抑えられていて、変数名に使用できないものを予約語といいます。
予約語かどうかは、variable name validatorなどで確認することができます(入力して、最後に「It is a reserved word.」と出るのは予約語)。

変数の呼び出し~オブジェクトとプロパティ

上のようにして変数に値を当てはめたら、例えば次のようにしてその値を呼び出すことができます。

alert (x);

alertメソッドでxを呼び出すことで、ダイアログに変数の値である「1」が表示されます。
仮にalert (‘x’);と入力すると、変数ではなく文字列として「x」が表示されますので、ご注意ください。

変数の寿命

Webページ上でJavaScriptにより変数に代入された値は、最も長く持ったとしてもページを再読み込みすると消えてしまいます。
もしJavaScriptで代入した変数の値を保存したい場合は、サーバサイドでの作業が必要となります。

JavaScriptの使い方・メソッド・プロパティまとめ
HTML/CSSとセットでフロントエンドエンジニア三種の神器のひとつ、JavaScript系の記事まとめです。

コメント