【JavaScript】制御命令②
はい、ちょっと長くなってきたので制御命令も記事を分けるよ!
どんどんいくわよー!
条件式によってループを制御する(while/do..while命令)
JSには繰り返し処理(反復処理)が複数ある
個々の構文はもちろん違いを理解しないといけない、はい!
まず、while/do..while命令
あらかじめ与えられた条件式が
trueである間ループを繰り返す
以下構文
while (条件式) { 条件式がtrueである時に実行される命令(群) }
do { 条件式がtrueである時に実行される命令(群) } while (条件式);
do..while命令のセミコロンを忘れやすいので注意
はい、具体例!
var x = 8; while (x < 10) { document.writeln('xの値は' + x); x++; }
var x = 8; do { document.writeln('xの値は' + x); x++; } while (x < 10);
この処理を実行するとどちらも
xの値は8
xの値は9
と表示される、確かにされました
これだけ見ると同じ処理に見えるけれども
変数xの初期値を10にしてみると
var x = 10; while (x < 10) { document.writeln('xの値は' + x); x++; }
上記は何も返さないのに対し
var x = 10; do { document.writeln('xの値は' + x); x++; } while (x < 10);
こちらは
xの値は10
と表示される
- while命令
- ループの最初で条件式を判定する(前置判定)
- 条件によっては一度もループを実行しない
- do..while命令
- ループも最後で条件式を判定する(後置判定)
- 条件に関わらず、最低1回はループを実行する
この違いは「ループが開始される前から条件式がfalseである場合」に
結果として現れる
ふむ、はあく!
補足:無限ループ
永遠に終了しない(終了条件がtrueにならない)ループのこと
うむ、これはよく聞く言葉なので分かる!
無限ループはブラウザに極端な負担を与え
フリーズさせる原因にもなるため
繰り返し処理を記述する場合
ループが正しく終了するかをあらかじめ確認すること
指定回数だけループを処理する(for命令)
以下構文
for (初期化式; ループ継続条件式; 増減式) { ループ内で実行する命令(群) }
具体例も連続でいくます
for (var x = 8; x < 10; x++){ document.writeln('xの値は' + x); }
実行すると
xの値は8
xの値は9
と表示される
さっきのwhile/do..while命令で使った例を
for命令で書き換えたもの
変数の値によってループを制御する場合には
while/do..while命令で書くよりもコンパクトに記述できる
さっきの構文でもあったようにfor命令は
カッコ内の「初期化式」「ループ継続条件式」「増減式」の3つで
ループを制御する
- forブロックに入った最初のループで初期化式を一回だけ実行する
- 例題では変数xに8をセット
- 一般的にはこの初期化式でfor命令によるループ回数を管理するカウンタ変数を初期化する
- ループ継続条件式はブロック内の処理を継続するための条件式を表す
- 例題では「x < 10」と指定されている、カウンタ変数xが10未満である間だけ繰り返しループする
- ブロック内の処理が1回実行されるたびに増減式が実行される
これらの式には基本的に
任意の式を指定することができるが
式の組む合わせによっては
無限ループにもなりえるので注意が必要
for (var x = 0; x < 5; x--){..} for (;;){..}
一行目のようなforループは
カウンタ変数xの初期値が0で
その後、ループの度にデクリメントされていくので
ループ継続条件である「x < 5」がfalseになることは
永遠にありえない
二行目は初期化式、ループ継続条件式、増減式が
省略されたパターン
この場合for命令は無条件にループを継続する
for命令苦手だ、これは例題たくさんやったほうが
良さげな気がするなーうむむ
配列内の要素を順に処理する(for..in命令)
指定された配列/連想配列やオブジェクト配下の
要素/メンバに対して先頭から順番に繰り返し処理を行う
以下構文
for(仮変数 in 配列/オブジェクト) { ループ内で実行する命令(群) }
仮変数には、配列/連想配列やオブジェクトから取り出された要素の
インデックス番号やキー名、メンバ名が格納され
for..inブロックの中で要素値を
参照する際に使用することができる
仮変数に格納されるのが
要素値そのものではないことに注意
どうしよう何言ってるかわからない←
とりあえず具体例みてみることにする
var member = ['山田', '鈴木', '佐藤']; for (var i in member) { document.writeln('名前は'+ member[i]); } var triangle = {width:30, height:50}; for (var j in triangle) { document.writeln(j + '=' + triangle[j]); } var book = new Object(); book.title = 'JavaScript 本格入門'; book.publish = '技術理論社'; book.price = '3000'; for (var k in book) { document.writeln(k + 'は' + book[k]); }
名前は山田
名前は鈴木
名前は佐藤
width=30
height=50
titleはJavaScript 本格入門
publishは技術理論社
priceは3000
あ、わかったなるほどなるほどふむー
triangleの例の場合仮変数に入っているのは
要素値そのものである30や50じゃなく
要素のキー名であるwidthとかheightなのね
通常配列の内容をfor..inループで
取り出さない方がいいらしい
じゃあなんで例に上げたんだw
- for..inループは配列のインデックス番号を取り出すだけなのでコードがあまりシンプルにならない(値そのものではないので、却って誤解を招く)
- コードによっては正しく動作しない場合がある
らしい、ほう‥
たしかにmemberの例でいくとわざわざ
インデックス番号をとってきているだけだから
仮変数iの中身をあえて表示したりしていないし
する必要もない、よなー
通常配列でほしいのってインデックス番号より
要素値そのものだからこの取り方は無駄が多い
for..inループを利用するのは
連想配列、オブジェクトのキーを走査する場合に留め
通常配列を走査する場合は原則として
forループを利用するようにする
はーい!きをつけます!
長いな制御命令‥記事わけます