くろひょうのwebデザインのお勉強帳

フェリカテクニカルアカデミー web制作科の受講生です。授業の要点、復習でつまづいた点などを記録し、レベルアップに励みます。

クリエイターになるための、お勉強の記録帳

[JavaScript]whileを使った文

ーー 式 ーーーーーーーーーーー

変数の初期値;
while(繰り返し条件;){
 実行される処理
変数の変更;

ーーーーーーーーーーーーーーーー

・反復処理を行う
・while文は繰り返す回数が決まっていない場合に使われる(延々と繰り返す)
  → 記述を間違うと無限ループになりやすいので注意

 

【例題1】

<body>
<script>
var i = 1;  //変数宣言
while ( i <= 10 ) {  // iが10以下の場合
  document.write ( i ); // 処理の内容①
  console.log ( i );  // 処理の内容② 
  i++;       // 1ずつ増えていく(インクリメント) 
}
</script>
</body>

 

・最初の数は1(変数宣言)
・iが10以下の場合、処理を実行する
・処理が終わったらiに1が加えられる
・再びwhileの条件文に戻り、iが10になるまで繰り返される

 

<結果の表示>
ブラウザ画面   

f:id:pleasure10501:20150330180022p:plain ※document.writeでは改行が入らないので、文字が続いてしまう

 

 【例題2】

1から100になるまで、2ずつ増えていく条件文

<script>
var i = 1;   //変数宣言
while ( i <= 100 ) {
  document.write ( i );
  console.log ( i );
  i += 2 ;
}
</script>

<結果の表示>
ブラウザ画面

 

f:id:pleasure10501:20150330181321p:plain

コンソール

f:id:pleasure10501:20150330181323p:plain