３章 JavaScript

sato mi

5年前

03 命令文（ステートメント）

ループから抜ける（break）
- 　「for」や「while」などで、繰り返し（ループ）処理を行っている時に使用します。
- 　条件式が真「true」の時に、一番内側のループを抜けます。
- 【構文】
  break;
- 【記述例】
  for (i=1; i<=10; i++) {
  document.write("10回表示しようとするが、：" +i+ "回目<br>");
  if (i==5)
  break;
  }
  document.write("breakがあるので5回目でループを抜けます。<br>");

コメント
- 　JavaScriptにコメントを書く時に使用します。
  
  "//"は、それ以降の1行が、"/* */"は、間に挟まれた文字列が、コメントとして扱われます。
- 【構文】
  //
  /* */
- 【記述例】
  //この1行がコメントになります。
  /* この囲まれた部分がコメントになります。 */

処理のスキップ（continue）
- 　「for」や「while」などで、繰り返し（ループ）処理を行っている時に使用します。
  　条件式が真「true」の時、"continue"以下の処理を飛ばして、繰り返し処理を続けます。
- 【構文】
  continue;
- 【記述例】
  for (i=1; i<=10; i++) {
  if (i==5)
  continue;
  document.write("10回表示しようとするが、：" +i+ "回目<br>");
  }
  document.write("continueがある5回目は表示されません。<br>");

繰り返し処理（for文）
- 　条件式が真「true」の間、処理を繰り返します。
  　
- 【構文】
  for (初期値;
  条件式; 増減式 ) { 処理 }
- 【記述例】
  for (i=1; i<=10; i++) {
  document.write("10回表示します。：" +i+ "回目<br>");
  }

プロパティ・メソッドの一覧（for…in文）
- 　オブジェクト内のプロパティ・メソッドを変数に代入しながら順番に取り出します。
  　
- 【構文】
  for (変数 in
  オブジェクト) { 処理 };
- 【記述例】
  for (var n in navigator) {
  document.write(n,"<br>");
  }

関数の設定（function）
- 　JavaScriptでは、一定の処理手続きを関数として設定することが出来ます。
- 　
  「function」の後に関数名とその処理を記述し、ページが読み込まれたタイミングや、イベントハンドラによってイベントが発生したタイミングで、関数名を呼ぶことによって処理が実行されます。
  　通常、関数の設定は、HTMLファイルの<HEAD></HEAD>タグ内で行います。これは、関数が設定される前に、<BODY></BODY>内で設定する関数名が呼ばれるのを防ぐためです。
  　
- 【構文】
  function
  関数名(引数,引数…,引数) { 処理 }
- 【記述例】
  function tasu(x,y) {
  document.write(x + "たす" + y + "は" + eval(x+y) + "です。<br>");
  }
  tasu(1,2);

条件分岐（if文）
- 　条件式が真「true」の時は処理１を行い、それ以外の時は処理２を行います。
  　「else」の処理がない時は省略可能です。
  　
- 【構文】
  if ( 条件式 ) {
  処理１ }
  else { 処理２ }
- 【記述例】
  var now = new Date();
  var AMPM = now.getHours();
  if (AMPM < 12 ) { document.write("午前<br>") }
  else { document.write("午後<br>") }

値の代入（var）
- 　変数、配列、オブジェクトなどの宣言を行います。
  　「=値」を設定すれば、「var 名」にその値が代入されます。
  　
- 【構文】
  var 名 [= 値]
  […, 名 [= 値] ]
- 【記述例】
  var item1 = 5;
  var item2 = "ひく";
  var item3 = 3;
  var item4 = "は";
  var item5 = "です。";
  document.write( item1 + item2 + item3 + item4 + eval(item1-item3) + item5);

繰り返し処理（while文）
- 　条件式が真「true」の間、処理を繰り返し行います。
  　
- 【構文】
  while( 条件式 )
  { 処理 }
- 【記述例】
  var i = 1;
  while ( i <= 10 ) {
  document.write("10回表示します。、：" +i+ "回目<br>");
  i++;
  }

オブジェクトの省略（with文）
- 　オブジェクトで指定したオブジェクトを省略して、プロパティやメソッドを使用できるようにします。
  　
- 【構文】
  with (
  オブジェクト ) { 処理 }
- 【記述例】
  with (document) {
  write("withを使用してdocument部分を省略しています。<br>");
  write("但し、withを多様すると処理速度が落ちます。<br>");
  }

戻り値を返す（return）
- 　命令文内で値を返す時に使用します。
  　返す値がない時は不要です。
  　
- 【構文】
  return 値
- 【記述例】
  <a href="http://www.ymbjp.com" onMouseOver="ymbホームページへリンクされています。;return
  true">カーソルが触れるとステータス行に表示されます。</a>

オブジェクトの参照（this）
- 　this（キーワード）の後に、指定したオブジェクトを参照します。
- 　オブジェクトは、継承関係を気にすることなく直接指定できます。
  　
- 【構文】
  this.オブジェクト
- 【記述例】
  <script language="JavaScript">
  <!—
  function Kaishya(n) { alert("会社名は"+n+"です。") }
  //—>
  </script>
  会社名を入力して下さい。<br>
  <form name="form01">
  <input type="text" name="Kaishya" onBlur="Kaishya(this.value)" value="">
  </form>

オブジェクトを作成する（インスタンスの作成）（new）
- 　
  ユーザ独自のオブジェクトを作成したり、ビルトインオブジェクトを使用する時に、new演算子を使って、オブジェクト名で指定いした名前を持った新たなオブジェクトを作成します。
  　
- 【構文】
  オブジェクト名 =
  new オブジェクトの型(値)
- 【記述例】
  <script language="JavaScript">
  <!—
  Today = new Date("Aug 8, 2006 18:00:00");
  document.write(Today,"<br>");
  Today.setDate(21);
  document.write(Today);
  //—>
  </script>

配列の作成
- 　 Arrayオブジェクトを使用して配列を作成します。
  　
- 【構文】
  配列名 = new
  Array(配列数);
  配列名[添え字] = 値;
- 【記述例】
  <script language="JavaScript">
  <!—
  youbi = new Array(7);
  youbi[0] = "日";
  youbi[1] = "月";
  youbi[2] = "火";
  youbi[3] = "水";
  youbi[4] = "木";
  youbi[5] = "金";
  youbi[6] = "土";
  for (i=0; i<youbi.length; i++) {
  document.write(youbi[i],"<br>");
  }
  //—>
  </script>

HTMLを配列として扱う

　リンクやフォームなどのHTMLタグは、JavaScriptのオブジェクトとして取り扱えるのと同時に、配列の要素としても取り扱えます。
　HTMLファイルに記述されている、それぞれのオブジェクトの上から、添え字が[0].[2].[3]…となる配列の要素が作成されます。それらの要素はオブジェクトの配列名[添え字]で取り扱うことが出来ます。

【構文】
オブジェクトの配列名[添え字] オブジェクトの配列名 anchors、applets、elements、embeds、forms、frames、history、images、layers、links、mineTypes、options、plugins

【記述例】
････
<script language="JavaScript">
<!—
function HtmlArray() {
document.forms[0].elements[0].value = "forms配列[0]のelements配列[0]の要素";
document.forms[0].elements[1].value = "forms配列[0]のelements配列[1]の要素";
document.forms[1].elements[0].value = "forms配列[1]のelements配列[0]の要素";
document.forms[1].elements[1].value = "forms配列[1]のelements配列[1]の要素";
}
//—>
</script>
････
<body onload="HtmlArray()">
<form name="form0">
<input type="text" name="htmlarray1" size="50"><br>
<input type="text" name="htmlarray1" size="50"><br>
</form>
<form name="form1">
<input type="text" name="htmlarray1" size="50"><br>
<input type="text" name="htmlarray1" size="50"><br>
</form>
････

ラベル
- 　
  式にラベルを設定しておくことにより、if文やfor文、while文のようなループ文から「break」や「continue」で抜ける時、ラベル名を指定して明示的に抜ける場所を指定することが出来ます。
  　
- 【構文】
  ラベル名 :
      式
      break ラベル名
      continue ラベル名
- 【記述例】
  var i=4;
  var j=2;
  var k=1;
  Label1 :
  if (4==i) {
  i=i*k;
  Label2 :
  if (2==j) {
  if (1==k) { break Label2 }
  break Label1;
  }
  k=0;
  }
  //—>
  </script>

繰り返し処理（do while文）
- 　 do while文は、条件式が偽「false」になるまで、処理を繰り返し行うような場合に使用します。
  　
- 【構文】
  do 処理
  while ( 条件式 );
- 【記述例】
  <script language="JavaScript">
  <!—
  var i=0;
  do {
  i+=1;
  document.write(i,"<br>");
  } while (i<10);
  //—>
  </script>

スイッチ（switch文）

　
switch文は、処理にラベルを設定し、各ラベルと値を参照し、真「true」になる処理を実行します。この時、もし真「true」になるラベルがない場合は、「default:」の処理を実行します。

【構文】
switch (値) { case ラベル１ : 処理; break; case ラベル２ : 処理; break; ･･･ default: 処理; }

【記述例】
<script language="JavaScript">
<!—
switch (i) {
case "10",10 :
      document.write(i,"月は運動会。");
      break;
case "11",11 :
      document.write(i,"月は紅葉狩り。");
      break;
default:
      document.write(i,"月の催し物はなに？");
      break;
}
//—>
</script>