JavaScriptの命令について



◆命令の種類について

 JavaScriptの命令には以下のものがあります。

 ▲条件分岐
  if...else
 ▲ループ命令
  for
  while
  break
  break *Label(Netscape 4.0以降)
  continue
  continue *Label(Netscape 4.0以降)
 ▲オブジェクト操作命令
  for...in
  new
  this
  with
 ▲コメント(注釈)
  //
  /*...*/

 以下に命令の概要と使用方法を説明します。

◆条件分岐

 条件分岐命令によっていろいろな処理を行うことができます。条件がtrue(真)の時、if文以下の命令が実行されます。false(偽)の場合、つまり条件が満たされなかった場合、else文があれば、それに続く処理を行います。命令の形式としては以下のような感じになります。

 if (条件) {
  命令1 }
 [else {
  命令2}]

 条件で使用できるのはJavaScriptで使用可能な式やtrue, falseです。複数の命令を記述するときは{〜}で囲みます。if文の中にさらにif文を記述することもできます。

 例:以下の関数checkDataではフォームに入力されたテキストの文字数が1969かどうか調べ、1969でなければアラートを表示して入力された文字数を表示します。

function checkData (){
if (document.form1.threeChar.value.length == 1969) {
return true}
else {
alert("入力した値" + document.form1.threeChar.value + "は私の誕生年じゃありません")
return false}
}

◆ループ命令

 ループ命令は指定された条件が満たされるまで処理を繰り返します。JavaScriptには2種類のループ命令(forとwhile)が用意されています。またループ命令に関するものとしてbreak文とcontinue文が用意されています。
 for...in命令についてはオブジェクト操作命令を参照してください。

▲for命令
 forループは指定された条件がfalse(偽)になるまで繰り返し処理を行います。JavaScriptはJavaやC言語と同じような書式になっています。つまり以下のようになります。

for ([初期値;] [条件;] [増減式]) {
命令
}

 forループは初期設定値からループを実行します。ループ内の命令は条件がtrueの場合のみ実行されます。ループ変数の増減はループの先頭に戻るときに実行されます。つまり以下のような順番で処理が行われます。

 1:初期値の設定を行います。これは一度のみ行われます。
 2:条件判断を行い、true(真)の場合はループ内の命令を実行します。false(偽)の場合はループ外へ抜けます。
 3:命令の実行を行います。
 4:ループ変数の増減処理を行います。
 5:(2)に戻ります。

例:以下のスクリプトは選択された項目の数をボタンを押すとアラートボックスに表示するものです。

<script language="JavaScript" type="text/javascript">
function howMany(selectObject) {
var numberSelected=0;
for (i=0; i < selectObject.options.length; i++) {
if (selectObject.options[i].selected==true)
numberSelected++;
}
return numberSelected;
}
</script>
<form name="selectForm">
<p>Choose some music types, then click the button below:</B>
<BR><SELECT NAME="musicTypes" MULTIPLE>
<OPTION SELECTED> Rock
<OPTION> Jazz </option>
<OPTION> Blues </option>
<OPTION> New Age </option>
<OPTION> Classical </option>
<OPTION> Opera </option>
</SELECT>
<P><INPUT TYPE="button" VALUE="How many are selected?" onClick="alert ('Number of options selected: ' + howMany(document.selectForm.musicTypes))">
</FORM>

▲while命令
 whileループは条件がtrue(真)の時のみ繰り返し処理を行います。while命令の書式は以下のようになります。

while (条件) {
命令
}

 もし条件がfalse(偽)だった場合はループ内は実行されずにループ外の命令に処理が移ります。条件判断はループ開始時とリピート時に行われます。

例1:以下の例ではnが3未満の時のみループします。

n = 0
x = 0
while( n < 3 ) {
n ++
x += n
}

 nが1増加するごとにxにnの値を加算していきます。nとxの値は次のようになります。

*1回目の処理:n = 1 and x = 1
*2回目の処理:n = 2 and x = 3
*3回目の処理:n = 3 and x = 6

 3回目委の処理が終わった時点で条件n<3が満たされない、つまりfalse(偽)になるのでループから抜けます。

例2:エンドレスループの場合は以下のようにします。while文の条件式が常にtrueなので、強制的にループ脱出を行わない限り永遠にループ内の処理を繰り返します。

while (true) {
alert("Hello, Linux !!") }

▲break命令
 break文はforループ、whileループから強制的に脱出する、つまりループを終了させる命令です。書式は以下のようになります。

break

 Netscape 4.0以降では中断先のジャンプ先をラベルで指定できるようになりました。ラベルは単語の最後端が:(コロン)になっています。
例:以下のプログラムではiが3になったらbreak命令でループを強制的に終わらせています。i=3の時に終了するので、この関数の戻り値は3*xとなります。

function testBreak(x) {
var i = 0
while (i < 6) {
if (i == 3)
break
i++
}
return i*x
}

▲continue命令
 continue文は以下に続くブロック内の命令を処理せずに強制的にループの先頭に戻す命令です。continue文の書式は以下のようになります。

continue

 break命令とは対照的に強制的にループの先頭に処理を移す命令です。ただしwhileループとforループでは若干の違いがあります。その違いを以下に示します。

 ・whileループの場合条件判断の処理に戻ります。
 ・forループの場合、ループ値の増減処理に戻ります。

例:以下にcontinue文を使用したプログラムを載せます。このプログラムを実行するとiが3になった時に条件判断に戻ります。この時はn+=iの処理は行われません。従ってnの値は1, 3, 7, 12のようになります。

i = 0
n = 0
while (i < 5) {
i++
if (i == 3)
continue
n += i
}

 また、Netscape 4.0以降では中断先のジャンプ先をラベルで指定できるようになりました。ラベルは単語の最後端が:(コロン)になっています。


◆オブジェクト操作命令
 JavaScriptはいくつかのオブジェクト操作命令が用意されています。for...in 命令, new オペレータ, this キーワード, with 命令があります。

▲for...in命令
 for...in命令はオブジェクトの全てのプロパティの値を参照しブロック内の命令を実行する(んでしょう・・・)。for...in命令の書式は以下のようになります。

for (variable in object) {
命令 }

▲newオペレーター
 newオペレーターは新しいオブジェクトを作成します。書式は以下のようになります。

objectName = new objectType ( param1 [,param2] ...[,paramN] )

詳細についてはnew命令の解説部分を参照してください。


▲thisキーワード
 このキーワードはカレントオブジェクトを参照する場合に使用します。通常、オブジェクトのメソッドを呼び出す場合に使われます。書式は以下のようになります。

this[.propertyName]

例:以下の例では入力された数値が18から99の間になければアラートボックスを表示します。

function validate(obj, lowval, hival) {
if ((obj.value < lowval) || (obj.value > hival))
alert("Invalid Value!")
}

<b>Enter a number between 18 and 99:</b>
<input type = "text" name = "age" size = 3 onChange="validate(this, 18, 99)">

▲with命令
 with命令を使用することによりデフォルトのオブジェクト名を省略することができます。通常オブジェクト名は省略できませんが、この命令を使用することにより可能になります。with命令の書式は以下のようになります。

with (object){
命令
}

例:以下の命令はMathオブジェクトをデフォルトオブジェクトとしています。したがってPI,SIN,COSのメソッドはMathオブジェクト名を省略しても正常に使用できます。

var a, x, y
var r=10
with (Math) {
a = PI * r * r
x = r * cos(PI)
y = r * sin(PI/2)
}


◆注釈

 コメントは実行されず、無視されます。JavaScriptはJavaと同じコメント形式を採用しています。

 ・先頭が//で始まる行。行末までがコメントになります。
 ・/*で始まり*/で終わる複数行。囲まれている部分全てがコメントになります。

以下の2つは両方ともコメント文です。

// パイ:あなたにはお金が足りないわ
/* カゲ:うぬぅ〜
 金が足りん!*/