JavaScriptでの変数の宣言、代入、参照の書式とコードについて紹介します。
変数宣言は下記の書式を利用します。
変数の宣言と同時に値の代入をする書式も利用できます。
下記のカンマで区切る書式を利用することで複数の変数を宣言できます。
EcmaScript6以降では let による変数宣言も利用できます。
変数の宣言と同時に値の代入をする書式も利用できます。
下記のカンマで区切る書式を利用することで複数の変数を宣言できます。
変数への値の代入は下記の書式を利用します。
代入は"="演算子を利用します。左辺に代入される変数名、右辺に代入する値を記述します。
参照は変数名を記述します。
変数 a を宣言します。
var a;
変数 textを宣言し、"あいうえお"をtext変数に代入します。
var text;
text = "あいうえお";
下記のHTMLファイルを作成します。
<!DOCTYPE html>
<html>
<head>
<title></title>
<script language="javascript" type="text/javascript">
window.onload = function onLoad() {
var a, b;
var c;
a = 12;
b = 51;
c = a + b;
var target = document.getElementById("output");
target.innerHTML = c;
}
</script>
</head>
<body>
<div id="output"></div>
</body>
</html>
下記コードにて、変数a, b, c を宣言します。
var a, b;
var c;
下記コードで代入と参照をしています。変数aには12を代入しています。変数bには51を代入しています。変数aとbの内容を参照し、変数cには変数aと変数bの値の和を代入しています。今回の場合は、変数aに12が、変数bに51が代入されているため、変数cの値は63になります。
a = 12;
b = 51;
c = a + b;
var target = document.getElementById("output");
target.innerHTML = c;
上記のHTMLファイルをWebブラウザで表示します。下図の結果が表示されます。
JavaScriptでは変数を利用する際にあらかじめ宣言をしておく必要が無いため、下記のコードでも動作します。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
window.onload = function onLoad() {
a = 12, b = 51;
c = a + b;
target = document.getElementById("output");
target.innerHTML = c;
}
</script></head>
<body>
<div id="output"></div>
</body>
</html>