(参考: 配列（Array） in とほほのJavaScriptリファレンス)
複数の変数をひとまとめにして通し番号を付け， その番号で指定した「変数」をアクセスする仕掛けを配列と呼ぶ．
配列オブジェクトは，複数の変数をひとまとめにして通し番号を付けた構造体で，
new 演算子を Array() 関数に作用させて生成する．
このときの Array() 関数の引数
は，作成する配列オブジェクトの大きさ (変数の数) で，
通し番号は，0 〜 n-1 となる．
new 演算子で生成された配列オブジェクトは，通常，変数に代入して用いる．
変数 x に代入した配列オブジェクトの i 番の要素 (変数) は，
x[] と表わす．
var x, y;
// 大きさ10の配列オブジェクトを生成して
// 変数 x に代入
x = new Array(10);
// xに代入された配列オブジェクトの
// 最初の要素 (変数) に100を代入する
x[0] = 100;
y = x[0]/100;
また，変数 x 中の配列オブジェクトの大きさ (長さ; 変数の数) は
x.length という表現で得られる．
new 演算子と
Array()
関数を用いる方法のほかに，あらかじめ初期値が定まっている配列は，
その初期値をコンマで区切って並べ，[ ] で括って表現することもできる．
例えば以下の (A), (B) は等価である．
var mtable = new Array(13); // mtable[0]〜mtable[12]
mtable[0] = undefined;
mtable[1] = "January"; mtable[2] = "February";
mtable[3] = "March"; mtable[4] = "April";
mtable[5] = "May"; mtable[6] = "June";
mtable[7] = "July"; mtable[8] = "August";
mtable[9] = "September"; mtable[10] = "October";
mtable[11] = "November"; mtable[12] = "December";
var mtable = [ undefined,
"Janumary", "February", "March", "April", "May", "June",
"July", "August", "September", "October", "November", "December" ];
月を 1〜12 の数で入力して，その英語訳の単語を返すプログラムを， switch を使わずに，配列を使って実現する．
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <title>JavaScript Sample 8-1</title> <script type="text/javascript"> <!-- /* このあたりで変換表の配列(オブジェクト)を生成して， * 適当な変数に代入しておく． */ function translate() { /* txtNumber から数を取り出し，(Number関数で変換してから) * 変換表を引いて，結果の英単語を txtEnglish に書きこむ． */ } // --> </script> <body> <h1>月の英語訳</h1> <form name="f"> <input type="text" name="txtNumber" size="3"> 月の英語訳は <input type="text" readonly name="txtEnglish"> です． <input type="button" value="実行" onclick="translate();"> </form> </body>
以下に例を示す．リンクをクリックすれば実行できる．(別ウィンドウで実行される)
フィボナッチ数列の最初の10項を計算して表示する． フィボナッチ数列とは，以下の漸化式にしたがう数列である．
| { |
| a1 = a2 = 1 |
| ai = ai-1 + ai-2 , (i≥3) |
以下に例を示す．リンクをクリックすれば実行できる．(別ウィンドウで実行される)
Webページを画面表示するときに，表示が完了してから何らかの処理を行いたい時がある．
例えば，ページ内にテキストボックスがあり，そこにプログラムで計算した値を書き込みたいとき，
<script> 〜 </script> の中で行おうとすると，
その時点ではまだテキストボックスそのものが生成されて(表示されて)おらず，
書きこむべき対象が存在しないため，エラーになってしまう．（下のコード
(A) 参照）
そのような場合，表示が完了した時に発生するイベント （= onload イベント）のイベントハンドラで書き込みを行えばよい．（下のコード (B) 参照）
この onload イベントのイベントハンドラは，<body> タグの
onload= 属性に記述する．
この onload イベントは，window オブジェクトで発生するイベントであるが，
イベントハンドラを記述するときは <body> タグに記述する．
（下のコード (B)参照）
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<title>JavaScript Sample 8-A</title>
<script type="text/javascript">
<!--
alert(document.f); /* document.f はまだ未定義 */
document.f.prob1.value = "10 + 2 ="; /* これはエラーになる */
//-->
</script>
<body>
<form name="f" action="">
<input name="prob1" size="9" type="text" readonly>
</form>
</body>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <title>JavaScript Sample 8-B</title> <script type="text/javascript"> <!-- function init() { /* onload イベント時に実行される */ alert(document.f); /* onload イベント時には document.f は存在する */ document.f.prob1.value = "10 + 2 ="; } //--> </script> <body onload="init();"> <!-- onload イベントハンドラはここで記述する --> <form name="f" action=""> <input name="prob1" size="9" type="text" readonly> </form> </body>
| 課題番号： | 8-1 |
| 課題名： | 計算練習プログラム(2) その1 |
| ファイル名： | task08-1.html |
| 締切： | 次回の演習日の直前の日曜日，18:00まで |
下図のような計算練習のプログラム「計算練習プログラム(2)」の作成を考える．
p1 〜 p10 とする），
解答を入力するためのテキストボックス（名前は a1 〜 a10 とする），
○×をつけるためのテキストボックス（名前は c1 〜 c10 とする）を用意する．ok, ng とする）を用意する．sol とする）を用意し，
乱数を用いて 第1問 〜 第10問 を生成するとともに，
それらの正解を sol[1] 〜 sol[10] に保存する．a1 〜 a10）に解答を記入し，答え合わせボタンをクリックする．a）の内容と
正解（sol[]）の内容を照合して，正誤欄(c)に○×をつけ，同時に正答数・誤答数をカウントする．ok），誤答数（ng）を表示する．sol を用意して，
そこに正解を保存するところまでは作成すること．sol は大域変数とすること．myRandom(n) 関数を用いてもよい．Moodle の課題ページからファイルを提出すること．ファイル名はすべて半角文字とする．