梅ちゃん堂 > JavaScript 入門 > JavaScript の基礎 >
- 変数と定数 -

1.変数とは

ユーザー定義関数と同様にユーザーが自由に定義できるのが変数です。 変数と言っても数値だけでなく、文字列、ブール型データ(true と false)、オブジェクトなど様々なデータを代入できます。 以下の例を見れば変数と定数の違いがわかります。

例1
alert("abc");

例2
var abc ="alphabet";
alert(abc);

例1では alert() メソッドの引数に "abc" というリテラル(定数値)が入っているので、 メッセージボックスには "abc" が表示されます。例2では変数 abc を宣言して、その値に "alphabet" というリテラルを代入しているので、 メッセージボックスには "alphabet" が表示されるというわけです。

要するに変数はデータを入れる「箱」のようなもので、変数名には特に意味がないと考えて良いわけです。 では変数名にはどんな文字を使用できるかというと、ユーザー定義関数の関数名の場合と同じく、半角の英数字及びアンダーバー( _ )です。 変数名の最初は英字またはアンダーバー( _ )を使うことが出来ますが、数字を最初に置いてはいけません。例:○ var a0 ○ var _a0 × var 0a アンダーバー( _ )以外の記号のほとんどは JavaScript の演算子として使用されるため、変数名の中には使えません。 また JavaScript の予約語(for, function, if, in, new, return, with 等々)と同じ語ももちろん使用できません。

JavaScript では、変数をあらかじめ宣言しなければならないという厳密な決まりはありませんが、 最初に変数を宣言して変数の中身を初期化することはよくあります。プログラムにとっては、そうしないとエラーが生じる場合があるからです。 変数の宣言の仕方は、

abc ="alphabet";

のように var を冠しない場合と、

var abc ="alphabet";

のように var を冠する場合とがあります。或る関数の中で変数を宣言した場合、var を冠して宣言したものは「ローカル変数」(その関数の中でのみ有効な変数)となります。 それ以外の場合は(var があってもなくても)グローバル変数(プログラム全体で有効な変数)となるようです。

2.定数について

このでもまた「数」という語が出てきましたが、JavaScript の定数はもちろん数値だけではありません。 変数がデータを入れる箱であるとすれば、定数はその中身になりうるようなものと考えればわかりやすいと思います。定数には次の3種類あります。

  1. 文字列定数:"abc"、"こんにちは"、"123" など、ダブルクオーテーション(" ")またはシングルクオーテーション(' ')で囲まれた語のことで、 どんな文字でも使用できます。(もちろんウェブページで非推奨とされている半角カタカナや特殊記号は使わないに越したことはありません。)
  2. ブール値:true と false です。これらはダブルクオーテーション(" ")やシングルクオーテーション(' ')で囲む必要がありません。 例:flag = false;
  3. 数値:数値の場合もダブルクオーテーション(" ")やシングルクオーテーション(' ')は不要です。例:num = 100; 仮にこれをダブルクオーテーション(" ")やシングルクオーテーション(' ')で囲んでしまうと、数値ではなく文字列として扱われます。 その差は次の例で明らかです。
    num = 100 + 200; // num の値は 300
    num = "100" + "200"; // num の値は "100200"

JavaScript にはダブルクオーテーション(" ")とシングルクオーテーション(' ')の機能上の違いはなく、 どちらも文字列定数を表すために使用されます。

msg = "ようこそ";
msg = 'ようこそ';

注意しなければならないのは、引用符の中で更に引用符が必要になるケースです。

<INPUT type="button" onClick="alert('ボタンがクリックされました')">

上の例では onClick 属性の値をダブルクオーテーション(" ")で囲んでいますが、 その中の alert() メソッドの引数が文字列定数を必要とするため、それをシングルクオーテーション(' ')で囲んでいます。 そうしないと(両方とも同じ引用符にすると)

<INPUT type="button" onClick="alert("ボタンがクリックされました")">

これではブラウザのスクリプトエンジンは onClick="alert(" で終了しているものと解釈し、エラーになってしまうのです。 初心者が陥りやすい初歩的ミスです。それを回避するためには、ダブルクオーテーション(" ")の中では引用符をシングルクオーテーション(' ')に、 逆にシングルクオーテーション(' ')の中では引用符をダブルクオーテーション(" ")にして区別して下さい。

では次の用法はどうでしょうか?

<INPUT type="button" onClick="alert('Welcome to "Java Script"!')">

これは、不可です。確かにダブルクオーテーション(" ")の中にシングルクオーテーション(' ')を、 シングルクオーテーション(' ')の中にダブルクオーテーション(" ")を使っていますが、 ブラウザのスクリプトエンジンは onClick="alert('Welcome to " で終了しているものと解釈するからです。

この問題を解決するには、引用符を伴う文字列定数をあらかじめ変数の中に入れておくのです。

Sample 9
ボタンをクリックして下さい。

ソース

<SCRIPT type="text/javascript">
<!--
  var msg='Welcome to "Java Script"!';

  function ShowMsg() {
    alert(msg);
  }
//-->
</SCRIPT>

<FORM>
<INPUT type="button" value="CLICK" onClick="ShowMsg()">
</FORM>

もう一つ、注意していただきたいのは、JavaScript では変数の型の扱いが厳しくなく、自由度が高いという点です。 下の例を見て下さい。

var A = 100;
var B = 200;
alert(A + B);

この例でメッセージボックスには A と B を足した結果、つまり 300 が表示されます。 alert() メソッドの引数は、alert("こんにちは") の場合のように本来は文字列であるべきですが、 スクリプトエンジンの内部で数値を自動的に文字列に変換してくれているのです。もう一つの例、

var A = 100;
var B = "200";
status = A + B;

この例ではブラウザのステータスバーに何と表示されるでしょう? 答えは "100200" です。数値と文字列を足すと、スクリプトエンジンは両者を文字列として解釈するからです。

前ページに戻る 前ページに戻る 次ページに進む
Copyright © 2003 梅ちゃん堂. All Rights Reserved