第七回 「繰り返し処理(1)」
前回はdocument.write()でメッセージやHTMLタグを表示、出力する方法を学びました。それが以下のものでした。
<html>
<head>
<title></title>
</head>
<body>
<script language="JavaScript"><!--
document.write("<hr><hr><hr><hr><hr>");
// --></script>
</body>
</html>
しかし、ここで<hr>を何度も繰り返して入力すると面倒ですし入力ミスも誘発してしまう恐れがあります。そこで今回はコンピューターが得意とする処理の1つ「繰り返し処理」について説明します。
繰り返し処理には「一定回数繰り返す」「条件を満たすまで繰り返す」ものがあります。今回は「一定回数繰り返す」命令を説明します。
一定回数繰り返し処理を行う命令は
for (i=0; i<終了値; i++)
のようになります。(本当はもっと細かく説明しないといけませんが、まずは「一定回数繰り返せば良い」ということで)
10回繰り返すならば終了値を10にすれば良いことになります。
以下が水平線を10本表示するプログラムになります。
<html>
<head>
<title></title>
</head>
<body>
<script language="JavaScript"><!--
for (i=0; i<10; i++) document.write("<hr>");
// --></script>
</body>
</html>
水平線でなく普通の文字も繰り返して表示させることができます。
以下のプログラムは「バグ」という文字を10回繰り返して表示します。
<html>
<head>
<title></title>
</head>
<body>
<script language="JavaScript"><!--
for (i=0; i<10; i++) document.write("バグ");
// --></script>
</body>
</html>
文字列とHTMLタグを組み合わせることもできます。バグという文字を横に連続表示するのではなく改行して表示するには以下のようになります。
<html>
<head>
<title></title>
</head>
<body>
<script language="JavaScript"><!--
for (i=0; i<10; i++) document.write("バグ<br>");
// --></script>
</body>
</html>
文字列とHTMLタグを組み合わせることで、面倒だった処理が簡単に行えます。と言っても実際には、こんな事例は滅多になく、1つずつ変化する、ランダムに変化する、など繰り返しに向かないような処理が多くあります。しかし、その中で繰り返せる部分を見つけて、うまく処理を行うことができれば良いのです。
次回も繰り返し処理について説明します。